@fluentui/react-combobox 9.3.4 → 9.4.0

package/lib/utils/useSelection.js

@@ -1,53 +1,61 @@
 import { useCallback } from 'react';
 import { useControllableState } from '@fluentui/react-utilities';
-export const useSelection = props => {
-  const {
-    defaultSelectedOptions,
-    multiselect,
-    onOptionSelect
-  } = props;
-  const [selectedOptions, setSelectedOptions] = useControllableState({
-    state: props.selectedOptions,
-    defaultState: defaultSelectedOptions,
-    initialState: []
-  });
-  const selectOption = useCallback((event, option) => {
-    // if the option is disabled, do nothing
-    if (option.disabled) {
-      return;
-    }
-    // for single-select, always return the selected option
-    let newSelection = [option.value];
-    // toggle selected state of the option for multiselect
-    if (multiselect) {
-      const selectedIndex = selectedOptions.findIndex(o => o === option.value);
-      if (selectedIndex > -1) {
-        // deselect option
-        newSelection = [...selectedOptions.slice(0, selectedIndex), ...selectedOptions.slice(selectedIndex + 1)];
-      } else {
-        // select option
-        newSelection = [...selectedOptions, option.value];
-      }
-    }
-    setSelectedOptions(newSelection);
-    onOptionSelect === null || onOptionSelect === void 0 ? void 0 : onOptionSelect(event, {
-      optionValue: option.value,
-      optionText: option.text,
-      selectedOptions: newSelection
+export const useSelection = (props)=>{
+    const { defaultSelectedOptions , multiselect , onOptionSelect  } = props;
+    const [selectedOptions, setSelectedOptions] = useControllableState({
+        state: props.selectedOptions,
+        defaultState: defaultSelectedOptions,
+        initialState: []
     });
-  }, [onOptionSelect, multiselect, selectedOptions, setSelectedOptions]);
-  const clearSelection = event => {
-    setSelectedOptions([]);
-    onOptionSelect === null || onOptionSelect === void 0 ? void 0 : onOptionSelect(event, {
-      optionValue: undefined,
-      optionText: undefined,
-      selectedOptions: []
-    });
-  };
-  return {
-    clearSelection,
-    selectOption,
-    selectedOptions
-  };
+    const selectOption = useCallback((event, option)=>{
+        // if the option is disabled, do nothing
+        if (option.disabled) {
+            return;
+        }
+        // for single-select, always return the selected option
+        let newSelection = [
+            option.value
+        ];
+        // toggle selected state of the option for multiselect
+        if (multiselect) {
+            const selectedIndex = selectedOptions.findIndex((o)=>o === option.value);
+            if (selectedIndex > -1) {
+                // deselect option
+                newSelection = [
+                    ...selectedOptions.slice(0, selectedIndex),
+                    ...selectedOptions.slice(selectedIndex + 1)
+                ];
+            } else {
+                // select option
+                newSelection = [
+                    ...selectedOptions,
+                    option.value
+                ];
+            }
+        }
+        setSelectedOptions(newSelection);
+        onOptionSelect === null || onOptionSelect === void 0 ? void 0 : onOptionSelect(event, {
+            optionValue: option.value,
+            optionText: option.text,
+            selectedOptions: newSelection
+        });
+    }, [
+        onOptionSelect,
+        multiselect,
+        selectedOptions,
+        setSelectedOptions
+    ]);
+    const clearSelection = (event)=>{
+        setSelectedOptions([]);
+        onOptionSelect === null || onOptionSelect === void 0 ? void 0 : onOptionSelect(event, {
+            optionValue: undefined,
+            optionText: undefined,
+            selectedOptions: []
+        });
+    };
+    return {
+        clearSelection,
+        selectOption,
+        selectedOptions
+    };
 };
-//# sourceMappingURL=useSelection.js.map

package/lib/utils/useSelection.js.map

@@ -1 +1 @@
-{"version":3,"names":["useCallback","useControllableState","useSelection","props","defaultSelectedOptions","multiselect","onOptionSelect","selectedOptions","setSelectedOptions","state","defaultState","initialState","selectOption","event","option","disabled","newSelection","value","selectedIndex","findIndex","o","slice","optionValue","optionText","text","clearSelection","undefined"],"sources":["../../src/utils/useSelection.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport { useControllableState } from '@fluentui/react-utilities';\nimport { OptionValue } from './OptionCollection.types';\nimport { SelectionEvents, SelectionProps, SelectionState } from './Selection.types';\n\nexport const useSelection = (props: SelectionProps): SelectionState => {\n  const { defaultSelectedOptions, multiselect, onOptionSelect } = props;\n\n  const [selectedOptions, setSelectedOptions] = useControllableState({\n    state: props.selectedOptions,\n    defaultState: defaultSelectedOptions,\n    initialState: [],\n  });\n\n  const selectOption = useCallback(\n    (event: SelectionEvents, option: OptionValue) => {\n      // if the option is disabled, do nothing\n      if (option.disabled) {\n        return;\n      }\n\n      // for single-select, always return the selected option\n      let newSelection = [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 = [...selectedOptions.slice(0, selectedIndex), ...selectedOptions.slice(selectedIndex + 1)];\n        } else {\n          // select option\n          newSelection = [...selectedOptions, option.value];\n        }\n      }\n\n      setSelectedOptions(newSelection);\n      onOptionSelect?.(event, { optionValue: option.value, optionText: option.text, selectedOptions: newSelection });\n    },\n    [onOptionSelect, multiselect, selectedOptions, setSelectedOptions],\n  );\n\n  const clearSelection = (event: SelectionEvents) => {\n    setSelectedOptions([]);\n    onOptionSelect?.(event, { optionValue: undefined, optionText: undefined, selectedOptions: [] });\n  };\n\n  return { clearSelection, selectOption, selectedOptions };\n};\n"],"mappings":"AAAA,SAASA,WAAW,QAAQ;AAC5B,SAASC,oBAAoB,QAAQ;AAIrC,OAAO,MAAMC,YAAA,GAAgBC,KAAA,IAA0C;EACrE,MAAM;IAAEC,sBAAA;IAAwBC,WAAA;IAAaC;EAAc,CAAE,GAAGH,KAAA;EAEhE,MAAM,CAACI,eAAA,EAAiBC,kBAAA,CAAmB,GAAGP,oBAAA,CAAqB;IACjEQ,KAAA,EAAON,KAAA,CAAMI,eAAe;IAC5BG,YAAA,EAAcN,sBAAA;IACdO,YAAA,EAAc;EAChB;EAEA,MAAMC,YAAA,GAAeZ,WAAA,CACnB,CAACa,KAAA,EAAwBC,MAAA,KAAwB;IAC/C;IACA,IAAIA,MAAA,CAAOC,QAAQ,EAAE;MACnB;IACF;IAEA;IACA,IAAIC,YAAA,GAAe,CAACF,MAAA,CAAOG,KAAK,CAAC;IAEjC;IACA,IAAIZ,WAAA,EAAa;MACf,MAAMa,aAAA,GAAgBX,eAAA,CAAgBY,SAAS,CAACC,CAAA,IAAKA,CAAA,KAAMN,MAAA,CAAOG,KAAK;MACvE,IAAIC,aAAA,GAAgB,CAAC,GAAG;QACtB;QACAF,YAAA,GAAe,C,GAAIT,eAAA,CAAgBc,KAAK,CAAC,GAAGH,aAAA,G,GAAmBX,eAAA,CAAgBc,KAAK,CAACH,aAAA,GAAgB,GAAG;MAC1G,OAAO;QACL;QACAF,YAAA,GAAe,C,GAAIT,eAAA,EAAiBO,MAAA,CAAOG,KAAK,CAAC;MACnD;IACF;IAEAT,kBAAA,CAAmBQ,YAAA;IACnBV,cAAA,aAAAA,cAAA,uBAAAA,cAAA,CAAiBO,KAAA,EAAO;MAAES,WAAA,EAAaR,MAAA,CAAOG,KAAK;MAAEM,UAAA,EAAYT,MAAA,CAAOU,IAAI;MAAEjB,eAAA,EAAiBS;IAAa;EAC9G,GACA,CAACV,cAAA,EAAgBD,WAAA,EAAaE,eAAA,EAAiBC,kBAAA,CAAmB;EAGpE,MAAMiB,cAAA,GAAkBZ,KAAA,IAA2B;IACjDL,kBAAA,CAAmB,EAAE;IACrBF,cAAA,aAAAA,cAAA,uBAAAA,cAAA,CAAiBO,KAAA,EAAO;MAAES,WAAA,EAAaI,SAAA;MAAWH,UAAA,EAAYG,SAAA;MAAWnB,eAAA,EAAiB;IAAG;EAC/F;EAEA,OAAO;IAAEkB,cAAA;IAAgBb,YAAA;IAAcL;EAAgB;AACzD"}
+{"version":3,"sources":["useSelection.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport { useControllableState } from '@fluentui/react-utilities';\nimport { OptionValue } from './OptionCollection.types';\nimport { SelectionEvents, SelectionProps, SelectionState } from './Selection.types';\n\nexport const useSelection = (props: SelectionProps): SelectionState => {\n  const { defaultSelectedOptions, multiselect, onOptionSelect } = props;\n\n  const [selectedOptions, setSelectedOptions] = useControllableState({\n    state: props.selectedOptions,\n    defaultState: defaultSelectedOptions,\n    initialState: [],\n  });\n\n  const selectOption = useCallback(\n    (event: SelectionEvents, option: OptionValue) => {\n      // if the option is disabled, do nothing\n      if (option.disabled) {\n        return;\n      }\n\n      // for single-select, always return the selected option\n      let newSelection = [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 = [...selectedOptions.slice(0, selectedIndex), ...selectedOptions.slice(selectedIndex + 1)];\n        } else {\n          // select option\n          newSelection = [...selectedOptions, option.value];\n        }\n      }\n\n      setSelectedOptions(newSelection);\n      onOptionSelect?.(event, { optionValue: option.value, optionText: option.text, selectedOptions: newSelection });\n    },\n    [onOptionSelect, multiselect, selectedOptions, setSelectedOptions],\n  );\n\n  const clearSelection = (event: SelectionEvents) => {\n    setSelectedOptions([]);\n    onOptionSelect?.(event, { optionValue: undefined, optionText: undefined, selectedOptions: [] });\n  };\n\n  return { clearSelection, selectOption, selectedOptions };\n};\n"],"names":["useCallback","useControllableState","useSelection","props","defaultSelectedOptions","multiselect","onOptionSelect","selectedOptions","setSelectedOptions","state","defaultState","initialState","selectOption","event","option","disabled","newSelection","value","selectedIndex","findIndex","o","slice","optionValue","optionText","text","clearSelection","undefined"],"mappings":"AAAA,SAASA,WAAW,QAAQ,QAAQ;AACpC,SAASC,oBAAoB,QAAQ,4BAA4B;AAIjE,OAAO,MAAMC,eAAe,CAACC,QAA0C;IACrE,MAAM,EAAEC,uBAAsB,EAAEC,YAAW,EAAEC,eAAc,EAAE,GAAGH;IAEhE,MAAM,CAACI,iBAAiBC,mBAAmB,GAAGP,qBAAqB;QACjEQ,OAAON,MAAMI,eAAe;QAC5BG,cAAcN;QACdO,cAAc,EAAE;IAClB;IAEA,MAAMC,eAAeZ,YACnB,CAACa,OAAwBC,SAAwB;QAC/C,wCAAwC;QACxC,IAAIA,OAAOC,QAAQ,EAAE;YACnB;QACF,CAAC;QAED,uDAAuD;QACvD,IAAIC,eAAe;YAACF,OAAOG,KAAK;SAAC;QAEjC,sDAAsD;QACtD,IAAIZ,aAAa;YACf,MAAMa,gBAAgBX,gBAAgBY,SAAS,CAACC,CAAAA,IAAKA,MAAMN,OAAOG,KAAK;YACvE,IAAIC,gBAAgB,CAAC,GAAG;gBACtB,kBAAkB;gBAClBF,eAAe;uBAAIT,gBAAgBc,KAAK,CAAC,GAAGH;uBAAmBX,gBAAgBc,KAAK,CAACH,gBAAgB;iBAAG;YAC1G,OAAO;gBACL,gBAAgB;gBAChBF,eAAe;uBAAIT;oBAAiBO,OAAOG,KAAK;iBAAC;YACnD,CAAC;QACH,CAAC;QAEDT,mBAAmBQ;QACnBV,2BAAAA,4BAAAA,KAAAA,IAAAA,eAAiBO,OAAO;YAAES,aAAaR,OAAOG,KAAK;YAAEM,YAAYT,OAAOU,IAAI;YAAEjB,iBAAiBS;QAAa;IAC9G,GACA;QAACV;QAAgBD;QAAaE;QAAiBC;KAAmB;IAGpE,MAAMiB,iBAAiB,CAACZ,QAA2B;QACjDL,mBAAmB,EAAE;QACrBF,2BAAAA,4BAAAA,KAAAA,IAAAA,eAAiBO,OAAO;YAAES,aAAaI;YAAWH,YAAYG;YAAWnB,iBAAiB,EAAE;QAAC;IAC/F;IAEA,OAAO;QAAEkB;QAAgBb;QAAcL;IAAgB;AACzD,EAAE"}

package/lib/utils/useTriggerListboxSlots.js

@@ -5,124 +5,110 @@ import { getDropdownActionFromKey, getIndexFromAction } from '../utils/dropdownK
  * useTriggerListboxSlots returns a tuple of trigger/listbox shorthand,
  * with the semantics and event handlers needed for the Combobox and Dropdown components.
  * The element type of the ref should always match the element type used in the trigger shorthand.
- */
-export function useTriggerListboxSlots(props, state, ref, triggerSlot, listboxSlot) {
-  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 = useId('fluent-listbox', listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id);
-  const listbox = listboxSlot && {
-    id: listboxId,
-    multiselect,
-    tabIndex: undefined,
-    ...listboxSlot
-  };
-  // resolve trigger shorthand props
-  const trigger = {
-    'aria-expanded': open,
-    '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: useMergedRefs(ref, triggerSlot === null || triggerSlot === void 0 ? void 0 : triggerSlot.ref, triggerRef)
-  };
-  /*
-  * Handle focus when clicking the listbox popup:
-  * 1. Move focus back to the button/input when the listbox is clicked (otherwise it goes to body)
-  * 2. Do not close the listbox on button/input blur when clicking into the listbox
-  */
-  const listboxOnClick = useEventCallback(mergeCallbacks(event => {
-    var _triggerRef_current;
-    (_triggerRef_current = triggerRef.current) === null || _triggerRef_current === void 0 ? void 0 : _triggerRef_current.focus();
-  }, listbox === null || listbox === void 0 ? void 0 : listbox.onClick));
-  const listboxOnMouseOver = useEventCallback(mergeCallbacks(event => {
-    setFocusVisible(false);
-  }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseOver));
-  const listboxOnMouseDown = useEventCallback(mergeCallbacks(event => {
-    ignoreNextBlur.current = true;
-  }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseDown));
-  // listbox is nullable, only add event handlers if it exists
-  if (listbox) {
-    listbox.onClick = listboxOnClick;
-    listbox.onMouseOver = listboxOnMouseOver;
-    listbox.onMouseDown = listboxOnMouseDown;
-  }
-  // the trigger should open/close the popup on click or blur
-  trigger.onBlur = mergeCallbacks(event => {
-    if (!ignoreNextBlur.current) {
-      setOpen(event, false);
+ */ export function useTriggerListboxSlots(props, state, ref, triggerSlot, listboxSlot) {
+    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 = useId('fluent-listbox', listboxSlot === null || listboxSlot === void 0 ? void 0 : listboxSlot.id);
+    const listbox = listboxSlot && {
+        id: listboxId,
+        multiselect,
+        tabIndex: undefined,
+        ...listboxSlot
+    };
+    // resolve trigger shorthand props
+    const trigger = {
+        'aria-expanded': open,
+        '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: useMergedRefs(ref, triggerSlot === null || triggerSlot === void 0 ? void 0 : triggerSlot.ref, triggerRef)
+    };
+    /*
+   * Handle focus when clicking the listbox popup:
+   * 1. Move focus back to the button/input when the listbox is clicked (otherwise it goes to body)
+   * 2. Do not close the listbox on button/input blur when clicking into the listbox
+   */ const listboxOnClick = useEventCallback(mergeCallbacks((event)=>{
+        var _triggerRef_current;
+        (_triggerRef_current = triggerRef.current) === null || _triggerRef_current === void 0 ? void 0 : _triggerRef_current.focus();
+    }, listbox === null || listbox === void 0 ? void 0 : listbox.onClick));
+    const listboxOnMouseOver = useEventCallback(mergeCallbacks((event)=>{
+        setFocusVisible(false);
+    }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseOver));
+    const listboxOnMouseDown = useEventCallback(mergeCallbacks((event)=>{
+        ignoreNextBlur.current = true;
+    }, listbox === null || listbox === void 0 ? void 0 : listbox.onMouseDown));
+    // listbox is nullable, only add event handlers if it exists
+    if (listbox) {
+        listbox.onClick = listboxOnClick;
+        listbox.onMouseOver = listboxOnMouseOver;
+        listbox.onMouseDown = listboxOnMouseDown;
     }
-    ignoreNextBlur.current = false;
-    setHasFocus(false);
-  }, trigger.onBlur);
-  trigger.onClick = mergeCallbacks(event => {
-    setOpen(event, !open);
-  }, trigger.onClick);
-  trigger.onFocus = mergeCallbacks(event => {
-    setHasFocus(true);
-  }, trigger.onFocus);
-  // handle combobox keyboard interaction
-  trigger.onKeyDown = mergeCallbacks(event => {
-    const action = getDropdownActionFromKey(event, {
-      open,
-      multiselect
-    });
-    const maxIndex = getCount() - 1;
-    const activeIndex = activeOption ? getIndexOfId(activeOption.id) : -1;
-    let newIndex = activeIndex;
-    switch (action) {
-      case 'Open':
-        event.preventDefault();
-        setFocusVisible(true);
-        setOpen(event, true);
-        break;
-      case 'Close':
-        // stop propagation for escape key to avoid dismissing any parent popups
-        event.stopPropagation();
-        event.preventDefault();
-        setOpen(event, false);
-        break;
-      case 'CloseSelect':
-        !multiselect && !(activeOption === null || activeOption === void 0 ? void 0 : activeOption.disabled) && setOpen(event, false);
-      // fallthrough
-      case 'Select':
-        activeOption && selectOption(event, activeOption);
-        event.preventDefault();
-        break;
-      case 'Tab':
-        !multiselect && activeOption && selectOption(event, activeOption);
-        break;
-      default:
-        newIndex = getIndexFromAction(action, activeIndex, maxIndex);
-    }
-    if (newIndex !== activeIndex) {
-      // prevent default page scroll/keyboard action if the index changed
-      event.preventDefault();
-      setActiveOption(getOptionAtIndex(newIndex));
-      setFocusVisible(true);
-    }
-  }, trigger.onKeyDown);
-  trigger.onMouseOver = mergeCallbacks(event => {
-    setFocusVisible(false);
-  }, trigger.onMouseOver);
-  return [trigger, listbox];
+    // the trigger should open/close the popup on click or blur
+    trigger.onBlur = mergeCallbacks((event)=>{
+        if (!ignoreNextBlur.current) {
+            setOpen(event, false);
+        }
+        ignoreNextBlur.current = false;
+        setHasFocus(false);
+    }, trigger.onBlur);
+    trigger.onClick = mergeCallbacks((event)=>{
+        setOpen(event, !open);
+    }, trigger.onClick);
+    trigger.onFocus = mergeCallbacks((event)=>{
+        setHasFocus(true);
+    }, trigger.onFocus);
+    // handle combobox keyboard interaction
+    trigger.onKeyDown = mergeCallbacks((event)=>{
+        const action = getDropdownActionFromKey(event, {
+            open,
+            multiselect
+        });
+        const maxIndex = getCount() - 1;
+        const activeIndex = activeOption ? getIndexOfId(activeOption.id) : -1;
+        let newIndex = activeIndex;
+        switch(action){
+            case 'Open':
+                event.preventDefault();
+                setFocusVisible(true);
+                setOpen(event, true);
+                break;
+            case 'Close':
+                // stop propagation for escape key to avoid dismissing any parent popups
+                event.stopPropagation();
+                event.preventDefault();
+                setOpen(event, false);
+                break;
+            case 'CloseSelect':
+                !multiselect && !(activeOption === null || activeOption === void 0 ? void 0 : activeOption.disabled) && setOpen(event, false);
+            // fallthrough
+            case 'Select':
+                activeOption && selectOption(event, activeOption);
+                event.preventDefault();
+                break;
+            case 'Tab':
+                !multiselect && activeOption && selectOption(event, activeOption);
+                break;
+            default:
+                newIndex = getIndexFromAction(action, activeIndex, maxIndex);
+        }
+        if (newIndex !== activeIndex) {
+            // prevent default page scroll/keyboard action if the index changed
+            event.preventDefault();
+            setActiveOption(getOptionAtIndex(newIndex));
+            setFocusVisible(true);
+        }
+    }, trigger.onKeyDown);
+    trigger.onMouseOver = mergeCallbacks((event)=>{
+        setFocusVisible(false);
+    }, trigger.onMouseOver);
+    return [
+        trigger,
+        listbox
+    ];
 }
-//# sourceMappingURL=useTriggerListboxSlots.js.map

package/lib/utils/useTriggerListboxSlots.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","mergeCallbacks","useId","useEventCallback","useMergedRefs","getDropdownActionFromKey","getIndexFromAction","useTriggerListboxSlots","props","state","ref","triggerSlot","listboxSlot","multiselect","activeOption","getCount","getIndexOfId","getOptionAtIndex","ignoreNextBlur","open","selectOption","setActiveOption","setFocusVisible","setHasFocus","setOpen","triggerRef","useRef","listboxId","id","listbox","tabIndex","undefined","trigger","role","listboxOnClick","event","_triggerRef_current","current","focus","onClick","listboxOnMouseOver","onMouseOver","listboxOnMouseDown","onMouseDown","onBlur","onFocus","onKeyDown","action","maxIndex","activeIndex","newIndex","preventDefault","stopPropagation","disabled"],"sources":["../../src/utils/useTriggerListboxSlots.ts"],"sourcesContent":["import * as React from 'react';\nimport { mergeCallbacks, useId, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport type { ExtractSlotProps, Slot } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey, getIndexFromAction } from '../utils/dropdownKeyActions';\nimport { Listbox } from '../components/Listbox/Listbox';\nimport type { ComboboxBaseProps, ComboboxBaseState } from './ComboboxBase.types';\n\nexport function useTriggerListboxSlots(\n  props: ComboboxBaseProps,\n  state: ComboboxBaseState,\n  ref: React.Ref<HTMLButtonElement>,\n  triggerSlot?: ExtractSlotProps<Slot<'button'>>,\n  listboxSlot?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [trigger: ExtractSlotProps<Slot<'button'>>, listbox?: ExtractSlotProps<Slot<typeof Listbox>>];\nexport function useTriggerListboxSlots(\n  props: ComboboxBaseProps,\n  state: ComboboxBaseState,\n  ref: React.Ref<HTMLInputElement>,\n  triggerSlot?: ExtractSlotProps<Slot<'input'>>,\n  listboxSlot?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [trigger: ExtractSlotProps<Slot<'input'>>, listbox?: ExtractSlotProps<Slot<typeof Listbox>>];\n\n/*\n * useTriggerListboxSlots returns a tuple of trigger/listbox shorthand,\n * with the semantics and event handlers needed for the Combobox and Dropdown components.\n * The element type of the ref should always match the element type used in the trigger shorthand.\n */\nexport function useTriggerListboxSlots(\n  props: ComboboxBaseProps,\n  state: ComboboxBaseState,\n  ref: React.Ref<HTMLButtonElement | HTMLInputElement>,\n  triggerSlot?: ExtractSlotProps<Slot<'input'>> | ExtractSlotProps<Slot<'button'>>,\n  listboxSlot?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [\n  trigger: ExtractSlotProps<Slot<'input'>> | ExtractSlotProps<Slot<'button'>>,\n  listbox?: ExtractSlotProps<Slot<typeof Listbox>>,\n] {\n  const { multiselect } = props;\n  const {\n    activeOption,\n    getCount,\n    getIndexOfId,\n    getOptionAtIndex,\n    ignoreNextBlur,\n    open,\n    selectOption,\n    setActiveOption,\n    setFocusVisible,\n    setHasFocus,\n    setOpen,\n  } = state;\n\n  // handle trigger focus/blur\n  const triggerRef: typeof ref = React.useRef(null);\n\n  // resolve listbox shorthand props\n  const listboxId = useId('fluent-listbox', listboxSlot?.id);\n  const listbox: typeof listboxSlot = listboxSlot && {\n    id: listboxId,\n    multiselect,\n    tabIndex: undefined,\n    ...listboxSlot,\n  };\n\n  // resolve trigger shorthand props\n  const trigger: typeof triggerSlot = {\n    'aria-expanded': open,\n    'aria-activedescendant': open ? activeOption?.id : undefined,\n    role: 'combobox',\n    ...triggerSlot,\n    // explicitly type the ref as an intersection here to prevent type errors\n    // since the `children` prop has mutually incompatible types between input/button\n    // functionally both ref and triggerRef will always be the same element type\n    ref: useMergedRefs(ref, triggerSlot?.ref, triggerRef) as React.Ref<HTMLButtonElement & HTMLInputElement>,\n  };\n\n  /*\n   * Handle focus when clicking the listbox popup:\n   * 1. Move focus back to the button/input when the listbox is clicked (otherwise it goes to body)\n   * 2. Do not close the listbox on button/input blur when clicking into the listbox\n   */\n  const listboxOnClick = useEventCallback(\n    mergeCallbacks((event: React.MouseEvent<HTMLDivElement>) => {\n      triggerRef.current?.focus();\n    }, listbox?.onClick),\n  );\n\n  const listboxOnMouseOver = useEventCallback(\n    mergeCallbacks((event: React.MouseEvent<HTMLDivElement>) => {\n      setFocusVisible(false);\n    }, listbox?.onMouseOver),\n  );\n\n  const listboxOnMouseDown = useEventCallback(\n    mergeCallbacks((event: React.MouseEvent<HTMLDivElement>) => {\n      ignoreNextBlur.current = true;\n    }, listbox?.onMouseDown),\n  );\n\n  // listbox is nullable, only add event handlers if it exists\n  if (listbox) {\n    listbox.onClick = listboxOnClick;\n    listbox.onMouseOver = listboxOnMouseOver;\n    listbox.onMouseDown = listboxOnMouseDown;\n  }\n\n  // the trigger should open/close the popup on click or blur\n  trigger.onBlur = mergeCallbacks((event: React.FocusEvent<HTMLButtonElement> & React.FocusEvent<HTMLInputElement>) => {\n    if (!ignoreNextBlur.current) {\n      setOpen(event, false);\n    }\n\n    ignoreNextBlur.current = false;\n\n    setHasFocus(false);\n  }, trigger.onBlur);\n\n  trigger.onClick = mergeCallbacks(\n    (event: React.MouseEvent<HTMLButtonElement> & React.MouseEvent<HTMLInputElement>) => {\n      setOpen(event, !open);\n    },\n    trigger.onClick,\n  );\n\n  trigger.onFocus = mergeCallbacks(\n    (event: React.FocusEvent<HTMLButtonElement> & React.FocusEvent<HTMLInputElement>) => {\n      setHasFocus(true);\n    },\n    trigger.onFocus,\n  );\n\n  // handle combobox keyboard interaction\n  trigger.onKeyDown = mergeCallbacks(\n    (event: React.KeyboardEvent<HTMLButtonElement> & React.KeyboardEvent<HTMLInputElement>) => {\n      const action = getDropdownActionFromKey(event, { open, multiselect });\n      const maxIndex = getCount() - 1;\n      const activeIndex = activeOption ? getIndexOfId(activeOption.id) : -1;\n      let newIndex = activeIndex;\n\n      switch (action) {\n        case 'Open':\n          event.preventDefault();\n          setFocusVisible(true);\n          setOpen(event, true);\n          break;\n        case 'Close':\n          // stop propagation for escape key to avoid dismissing any parent popups\n          event.stopPropagation();\n          event.preventDefault();\n          setOpen(event, false);\n          break;\n        case 'CloseSelect':\n          !multiselect && !activeOption?.disabled && setOpen(event, false);\n        // fallthrough\n        case 'Select':\n          activeOption && selectOption(event, activeOption);\n          event.preventDefault();\n          break;\n        case 'Tab':\n          !multiselect && activeOption && selectOption(event, activeOption);\n          break;\n        default:\n          newIndex = getIndexFromAction(action, activeIndex, maxIndex);\n      }\n      if (newIndex !== activeIndex) {\n        // prevent default page scroll/keyboard action if the index changed\n        event.preventDefault();\n        setActiveOption(getOptionAtIndex(newIndex));\n        setFocusVisible(true);\n      }\n    },\n    trigger.onKeyDown,\n  );\n\n  trigger.onMouseOver = mergeCallbacks(\n    (event: React.MouseEvent<HTMLButtonElement> & React.MouseEvent<HTMLInputElement>) => {\n      setFocusVisible(false);\n    },\n    trigger.onMouseOver,\n  );\n\n  return [trigger, listbox];\n}\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,cAAc,EAAEC,KAAK,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ;AAEvE,SAASC,wBAAwB,EAAEC,kBAAkB,QAAQ;AAmB7D;;;;;AAKA,OAAO,SAASC,uBACdC,KAAwB,EACxBC,KAAwB,EACxBC,GAAoD,EACpDC,WAAgF,EAChFC,WAAoD,EAIpD;EACA,MAAM;IAAEC;EAAW,CAAE,GAAGL,KAAA;EACxB,MAAM;IACJM,YAAA;IACAC,QAAA;IACAC,YAAA;IACAC,gBAAA;IACAC,cAAA;IACAC,IAAA;IACAC,YAAA;IACAC,eAAA;IACAC,eAAA;IACAC,WAAA;IACAC;EAAO,CACR,GAAGf,KAAA;EAEJ;EACA,MAAMgB,UAAA,GAAyBzB,KAAA,CAAM0B,MAAM,CAAC,IAAI;EAEhD;EACA,MAAMC,SAAA,GAAYzB,KAAA,CAAM,kBAAkBU,WAAA,aAAAA,WAAA,uBAAAA,WAAA,CAAagB,EAAE;EACzD,MAAMC,OAAA,GAA8BjB,WAAA,IAAe;IACjDgB,EAAA,EAAID,SAAA;IACJd,WAAA;IACAiB,QAAA,EAAUC,SAAA;IACV,GAAGnB;EACL;EAEA;EACA,MAAMoB,OAAA,GAA8B;IAClC,iBAAiBb,IAAA;IACjB,yBAAyBA,IAAA,GAAOL,YAAA,aAAAA,YAAA,uBAAAA,YAAA,CAAcc,EAAE,GAAGG,SAAS;IAC5DE,IAAA,EAAM;IACN,GAAGtB,WAAW;IACd;IACA;IACA;IACAD,GAAA,EAAKN,aAAA,CAAcM,GAAA,EAAKC,WAAA,aAAAA,WAAA,uBAAAA,WAAA,CAAaD,GAAG,EAAEe,UAAA;EAC5C;EAEA;;;;;EAKA,MAAMS,cAAA,GAAiB/B,gBAAA,CACrBF,cAAA,CAAgBkC,KAAA,IAA4C;QAC1DC,mBAAA;IAAA,CAAAA,mBAAA,GAAAX,UAAA,CAAWY,OAAO,cAAlBD,mBAAA,uBAAAA,mBAAA,CAAoBE,KAAA;EACtB,GAAGT,OAAA,aAAAA,OAAA,uBAAAA,OAAA,CAASU,OAAO;EAGrB,MAAMC,kBAAA,GAAqBrC,gBAAA,CACzBF,cAAA,CAAgBkC,KAAA,IAA4C;IAC1Db,eAAA,CAAgB,KAAK;EACvB,GAAGO,OAAA,aAAAA,OAAA,uBAAAA,OAAA,CAASY,WAAW;EAGzB,MAAMC,kBAAA,GAAqBvC,gBAAA,CACzBF,cAAA,CAAgBkC,KAAA,IAA4C;IAC1DjB,cAAA,CAAemB,OAAO,GAAG,IAAI;EAC/B,GAAGR,OAAA,aAAAA,OAAA,uBAAAA,OAAA,CAASc,WAAW;EAGzB;EACA,IAAId,OAAA,EAAS;IACXA,OAAA,CAAQU,OAAO,GAAGL,cAAA;IAClBL,OAAA,CAAQY,WAAW,GAAGD,kBAAA;IACtBX,OAAA,CAAQc,WAAW,GAAGD,kBAAA;EACxB;EAEA;EACAV,OAAA,CAAQY,MAAM,GAAG3C,cAAA,CAAgBkC,KAAA,IAAoF;IACnH,IAAI,CAACjB,cAAA,CAAemB,OAAO,EAAE;MAC3Bb,OAAA,CAAQW,KAAA,EAAO,KAAK;IACtB;IAEAjB,cAAA,CAAemB,OAAO,GAAG,KAAK;IAE9Bd,WAAA,CAAY,KAAK;EACnB,GAAGS,OAAA,CAAQY,MAAM;EAEjBZ,OAAA,CAAQO,OAAO,GAAGtC,cAAA,CACfkC,KAAA,IAAoF;IACnFX,OAAA,CAAQW,KAAA,EAAO,CAAChB,IAAA;EAClB,GACAa,OAAA,CAAQO,OAAO;EAGjBP,OAAA,CAAQa,OAAO,GAAG5C,cAAA,CACfkC,KAAA,IAAoF;IACnFZ,WAAA,CAAY,IAAI;EAClB,GACAS,OAAA,CAAQa,OAAO;EAGjB;EACAb,OAAA,CAAQc,SAAS,GAAG7C,cAAA,CACjBkC,KAAA,IAA0F;IACzF,MAAMY,MAAA,GAAS1C,wBAAA,CAAyB8B,KAAA,EAAO;MAAEhB,IAAA;MAAMN;IAAY;IACnE,MAAMmC,QAAA,GAAWjC,QAAA,KAAa;IAC9B,MAAMkC,WAAA,GAAcnC,YAAA,GAAeE,YAAA,CAAaF,YAAA,CAAac,EAAE,IAAI,CAAC,CAAC;IACrE,IAAIsB,QAAA,GAAWD,WAAA;IAEf,QAAQF,MAAA;MACN,KAAK;QACHZ,KAAA,CAAMgB,cAAc;QACpB7B,eAAA,CAAgB,IAAI;QACpBE,OAAA,CAAQW,KAAA,EAAO,IAAI;QACnB;MACF,KAAK;QACH;QACAA,KAAA,CAAMiB,eAAe;QACrBjB,KAAA,CAAMgB,cAAc;QACpB3B,OAAA,CAAQW,KAAA,EAAO,KAAK;QACpB;MACF,KAAK;QACH,CAACtB,WAAA,IAAe,EAACC,YAAA,aAAAA,YAAA,uBAAAA,YAAA,CAAcuC,QAAQ,CAAD,IAAK7B,OAAA,CAAQW,KAAA,EAAO,KAAK;MACjE;MACA,KAAK;QACHrB,YAAA,IAAgBM,YAAA,CAAae,KAAA,EAAOrB,YAAA;QACpCqB,KAAA,CAAMgB,cAAc;QACpB;MACF,KAAK;QACH,CAACtC,WAAA,IAAeC,YAAA,IAAgBM,YAAA,CAAae,KAAA,EAAOrB,YAAA;QACpD;MACF;QACEoC,QAAA,GAAW5C,kBAAA,CAAmByC,MAAA,EAAQE,WAAA,EAAaD,QAAA;IAAA;IAEvD,IAAIE,QAAA,KAAaD,WAAA,EAAa;MAC5B;MACAd,KAAA,CAAMgB,cAAc;MACpB9B,eAAA,CAAgBJ,gBAAA,CAAiBiC,QAAA;MACjC5B,eAAA,CAAgB,IAAI;IACtB;EACF,GACAU,OAAA,CAAQc,SAAS;EAGnBd,OAAA,CAAQS,WAAW,GAAGxC,cAAA,CACnBkC,KAAA,IAAoF;IACnFb,eAAA,CAAgB,KAAK;EACvB,GACAU,OAAA,CAAQS,WAAW;EAGrB,OAAO,CAACT,OAAA,EAASH,OAAA,CAAQ;AAC3B"}
+{"version":3,"sources":["useTriggerListboxSlots.ts"],"sourcesContent":["import * as React from 'react';\nimport { mergeCallbacks, useId, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport type { ExtractSlotProps, Slot } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey, getIndexFromAction } from '../utils/dropdownKeyActions';\nimport { Listbox } from '../components/Listbox/Listbox';\nimport type { ComboboxBaseProps, ComboboxBaseState } from './ComboboxBase.types';\n\nexport function useTriggerListboxSlots(\n  props: ComboboxBaseProps,\n  state: ComboboxBaseState,\n  ref: React.Ref<HTMLButtonElement>,\n  triggerSlot?: ExtractSlotProps<Slot<'button'>>,\n  listboxSlot?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [trigger: ExtractSlotProps<Slot<'button'>>, listbox?: ExtractSlotProps<Slot<typeof Listbox>>];\nexport function useTriggerListboxSlots(\n  props: ComboboxBaseProps,\n  state: ComboboxBaseState,\n  ref: React.Ref<HTMLInputElement>,\n  triggerSlot?: ExtractSlotProps<Slot<'input'>>,\n  listboxSlot?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [trigger: ExtractSlotProps<Slot<'input'>>, listbox?: ExtractSlotProps<Slot<typeof Listbox>>];\n\n/*\n * useTriggerListboxSlots returns a tuple of trigger/listbox shorthand,\n * with the semantics and event handlers needed for the Combobox and Dropdown components.\n * The element type of the ref should always match the element type used in the trigger shorthand.\n */\nexport function useTriggerListboxSlots(\n  props: ComboboxBaseProps,\n  state: ComboboxBaseState,\n  ref: React.Ref<HTMLButtonElement | HTMLInputElement>,\n  triggerSlot?: ExtractSlotProps<Slot<'input'>> | ExtractSlotProps<Slot<'button'>>,\n  listboxSlot?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [\n  trigger: ExtractSlotProps<Slot<'input'>> | ExtractSlotProps<Slot<'button'>>,\n  listbox?: ExtractSlotProps<Slot<typeof Listbox>>,\n] {\n  const { multiselect } = props;\n  const {\n    activeOption,\n    getCount,\n    getIndexOfId,\n    getOptionAtIndex,\n    ignoreNextBlur,\n    open,\n    selectOption,\n    setActiveOption,\n    setFocusVisible,\n    setHasFocus,\n    setOpen,\n  } = state;\n\n  // handle trigger focus/blur\n  const triggerRef: typeof ref = React.useRef(null);\n\n  // resolve listbox shorthand props\n  const listboxId = useId('fluent-listbox', listboxSlot?.id);\n  const listbox: typeof listboxSlot = listboxSlot && {\n    id: listboxId,\n    multiselect,\n    tabIndex: undefined,\n    ...listboxSlot,\n  };\n\n  // resolve trigger shorthand props\n  const trigger: typeof triggerSlot = {\n    'aria-expanded': open,\n    'aria-activedescendant': open ? activeOption?.id : undefined,\n    role: 'combobox',\n    ...triggerSlot,\n    // explicitly type the ref as an intersection here to prevent type errors\n    // since the `children` prop has mutually incompatible types between input/button\n    // functionally both ref and triggerRef will always be the same element type\n    ref: useMergedRefs(ref, triggerSlot?.ref, triggerRef) as React.Ref<HTMLButtonElement & HTMLInputElement>,\n  };\n\n  /*\n   * Handle focus when clicking the listbox popup:\n   * 1. Move focus back to the button/input when the listbox is clicked (otherwise it goes to body)\n   * 2. Do not close the listbox on button/input blur when clicking into the listbox\n   */\n  const listboxOnClick = useEventCallback(\n    mergeCallbacks((event: React.MouseEvent<HTMLDivElement>) => {\n      triggerRef.current?.focus();\n    }, listbox?.onClick),\n  );\n\n  const listboxOnMouseOver = useEventCallback(\n    mergeCallbacks((event: React.MouseEvent<HTMLDivElement>) => {\n      setFocusVisible(false);\n    }, listbox?.onMouseOver),\n  );\n\n  const listboxOnMouseDown = useEventCallback(\n    mergeCallbacks((event: React.MouseEvent<HTMLDivElement>) => {\n      ignoreNextBlur.current = true;\n    }, listbox?.onMouseDown),\n  );\n\n  // listbox is nullable, only add event handlers if it exists\n  if (listbox) {\n    listbox.onClick = listboxOnClick;\n    listbox.onMouseOver = listboxOnMouseOver;\n    listbox.onMouseDown = listboxOnMouseDown;\n  }\n\n  // the trigger should open/close the popup on click or blur\n  trigger.onBlur = mergeCallbacks((event: React.FocusEvent<HTMLButtonElement> & React.FocusEvent<HTMLInputElement>) => {\n    if (!ignoreNextBlur.current) {\n      setOpen(event, false);\n    }\n\n    ignoreNextBlur.current = false;\n\n    setHasFocus(false);\n  }, trigger.onBlur);\n\n  trigger.onClick = mergeCallbacks(\n    (event: React.MouseEvent<HTMLButtonElement> & React.MouseEvent<HTMLInputElement>) => {\n      setOpen(event, !open);\n    },\n    trigger.onClick,\n  );\n\n  trigger.onFocus = mergeCallbacks(\n    (event: React.FocusEvent<HTMLButtonElement> & React.FocusEvent<HTMLInputElement>) => {\n      setHasFocus(true);\n    },\n    trigger.onFocus,\n  );\n\n  // handle combobox keyboard interaction\n  trigger.onKeyDown = mergeCallbacks(\n    (event: React.KeyboardEvent<HTMLButtonElement> & React.KeyboardEvent<HTMLInputElement>) => {\n      const action = getDropdownActionFromKey(event, { open, multiselect });\n      const maxIndex = getCount() - 1;\n      const activeIndex = activeOption ? getIndexOfId(activeOption.id) : -1;\n      let newIndex = activeIndex;\n\n      switch (action) {\n        case 'Open':\n          event.preventDefault();\n          setFocusVisible(true);\n          setOpen(event, true);\n          break;\n        case 'Close':\n          // stop propagation for escape key to avoid dismissing any parent popups\n          event.stopPropagation();\n          event.preventDefault();\n          setOpen(event, false);\n          break;\n        case 'CloseSelect':\n          !multiselect && !activeOption?.disabled && setOpen(event, false);\n        // fallthrough\n        case 'Select':\n          activeOption && selectOption(event, activeOption);\n          event.preventDefault();\n          break;\n        case 'Tab':\n          !multiselect && activeOption && selectOption(event, activeOption);\n          break;\n        default:\n          newIndex = getIndexFromAction(action, activeIndex, maxIndex);\n      }\n      if (newIndex !== activeIndex) {\n        // prevent default page scroll/keyboard action if the index changed\n        event.preventDefault();\n        setActiveOption(getOptionAtIndex(newIndex));\n        setFocusVisible(true);\n      }\n    },\n    trigger.onKeyDown,\n  );\n\n  trigger.onMouseOver = mergeCallbacks(\n    (event: React.MouseEvent<HTMLButtonElement> & React.MouseEvent<HTMLInputElement>) => {\n      setFocusVisible(false);\n    },\n    trigger.onMouseOver,\n  );\n\n  return [trigger, listbox];\n}\n"],"names":["React","mergeCallbacks","useId","useEventCallback","useMergedRefs","getDropdownActionFromKey","getIndexFromAction","useTriggerListboxSlots","props","state","ref","triggerSlot","listboxSlot","multiselect","activeOption","getCount","getIndexOfId","getOptionAtIndex","ignoreNextBlur","open","selectOption","setActiveOption","setFocusVisible","setHasFocus","setOpen","triggerRef","useRef","listboxId","id","listbox","tabIndex","undefined","trigger","role","listboxOnClick","event","current","focus","onClick","listboxOnMouseOver","onMouseOver","listboxOnMouseDown","onMouseDown","onBlur","onFocus","onKeyDown","action","maxIndex","activeIndex","newIndex","preventDefault","stopPropagation","disabled"],"mappings":"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"}

package/lib-commonjs/Combobox.js

@@ -4,6 +4,3 @@ Object.defineProperty(exports, "__esModule", {
 });
 const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
 _exportStar(require("./components/Combobox/index"), exports);
- //# sourceMappingURL=Combobox.js.map
-
-//# sourceMappingURL=Combobox.js.map

package/lib-commonjs/Combobox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../lib/Combobox.js"],"sourcesContent":["export * from './components/Combobox/index';\n//# sourceMappingURL=Combobox.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,oCAAoC"}
+{"version":3,"sources":["Combobox.js"],"sourcesContent":["export * from './components/Combobox/index';\n"],"names":[],"mappings":";;;;;oBAAc"}

package/lib-commonjs/Dropdown.js

@@ -4,6 +4,3 @@ Object.defineProperty(exports, "__esModule", {
 });
 const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
 _exportStar(require("./components/Dropdown/index"), exports);
- //# sourceMappingURL=Dropdown.js.map
-
-//# sourceMappingURL=Dropdown.js.map

package/lib-commonjs/Dropdown.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../lib/Dropdown.js"],"sourcesContent":["export * from './components/Dropdown/index';\n//# sourceMappingURL=Dropdown.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,oCAAoC"}
+{"version":3,"sources":["Dropdown.js"],"sourcesContent":["export * from './components/Dropdown/index';\n"],"names":[],"mappings":";;;;;oBAAc"}

package/lib-commonjs/Listbox.js

@@ -4,6 +4,3 @@ Object.defineProperty(exports, "__esModule", {
 });
 const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
 _exportStar(require("./components/Listbox/index"), exports);
- //# sourceMappingURL=Listbox.js.map
-
-//# sourceMappingURL=Listbox.js.map

package/lib-commonjs/Listbox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../lib/Listbox.js"],"sourcesContent":["export * from './components/Listbox/index';\n//# sourceMappingURL=Listbox.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,mCAAmC"}
+{"version":3,"sources":["Listbox.js"],"sourcesContent":["export * from './components/Listbox/index';\n"],"names":[],"mappings":";;;;;oBAAc"}

package/lib-commonjs/Option.js

@@ -4,6 +4,3 @@ Object.defineProperty(exports, "__esModule", {
 });
 const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
 _exportStar(require("./components/Option/index"), exports);
- //# sourceMappingURL=Option.js.map
-
-//# sourceMappingURL=Option.js.map

package/lib-commonjs/Option.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../lib/Option.js"],"sourcesContent":["export * from './components/Option/index';\n//# sourceMappingURL=Option.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,kCAAkC"}
+{"version":3,"sources":["Option.js"],"sourcesContent":["export * from './components/Option/index';\n"],"names":[],"mappings":";;;;;oBAAc"}

package/lib-commonjs/OptionGroup.js

@@ -4,6 +4,3 @@ Object.defineProperty(exports, "__esModule", {
 });
 const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
 _exportStar(require("./components/OptionGroup/index"), exports);
- //# sourceMappingURL=OptionGroup.js.map
-
-//# sourceMappingURL=OptionGroup.js.map

package/lib-commonjs/OptionGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../lib/OptionGroup.js"],"sourcesContent":["export * from './components/OptionGroup/index';\n//# sourceMappingURL=OptionGroup.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,uCAAuC"}
+{"version":3,"sources":["OptionGroup.js"],"sourcesContent":["export * from './components/OptionGroup/index';\n"],"names":[],"mappings":";;;;;oBAAc"}

package/lib-commonjs/Selection.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
+_exportStar(require("./utils/Selection.types"), exports);

package/lib-commonjs/Selection.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Selection.js"],"sourcesContent":["export * from './utils/Selection.types';\n"],"names":[],"mappings":";;;;;oBAAc"}

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

@@ -20,6 +20,4 @@ const Combobox = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     (0, _reactSharedContexts.useCustomStyleHook_unstable)('useComboboxStyles_unstable')(state);
     return (0, _renderCombobox.renderCombobox_unstable)(state, contextValues);
 });
-Combobox.displayName = 'Combobox'; //# sourceMappingURL=Combobox.js.map
-
-//# sourceMappingURL=Combobox.js.map
+Combobox.displayName = 'Combobox';

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/Combobox/Combobox.js"],"sourcesContent":["import * as React from 'react';\nimport { useCombobox_unstable } from './useCombobox';\nimport { renderCombobox_unstable } from './renderCombobox';\nimport { useComboboxStyles_unstable } from './useComboboxStyles.styles';\nimport { useComboboxContextValues } from '../../contexts/useComboboxContextValues';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n/**\n * Combobox component: a selection control that allows users to choose from a set of possible options\n */\nexport const Combobox = /*#__PURE__*/React.forwardRef((props, ref) => {\n  const state = useCombobox_unstable(props, ref);\n  const contextValues = useComboboxContextValues(state);\n  useComboboxStyles_unstable(state);\n  useCustomStyleHook_unstable('useComboboxStyles_unstable')(state);\n  return renderCombobox_unstable(state, contextValues);\n});\nCombobox.displayName = 'Combobox';\n//# sourceMappingURL=Combobox.js.map"],"names":["Combobox","React","forwardRef","props","ref","state","useCombobox_unstable","contextValues","useComboboxContextValues","useComboboxStyles_unstable","useCustomStyleHook_unstable","renderCombobox_unstable","displayName"],"mappings":";;;;+BASaA;;aAAAA;;;6DATU;6BACc;gCACG;yCACG;0CACF;qCACG;AAIrC,MAAMA,WAAW,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACpE,MAAMC,QAAQC,IAAAA,iCAAoB,EAACH,OAAOC;IAC1C,MAAMG,gBAAgBC,IAAAA,kDAAwB,EAACH;IAC/CI,IAAAA,mDAA0B,EAACJ;IAC3BK,IAAAA,gDAA2B,EAAC,8BAA8BL;IAC1D,OAAOM,IAAAA,uCAAuB,EAACN,OAAOE;AACxC;AACAP,SAASY,WAAW,GAAG,YACvB,oCAAoC"}
+{"version":3,"sources":["Combobox.js"],"sourcesContent":["import * as React from 'react';\nimport { useCombobox_unstable } from './useCombobox';\nimport { renderCombobox_unstable } from './renderCombobox';\nimport { useComboboxStyles_unstable } from './useComboboxStyles.styles';\nimport { useComboboxContextValues } from '../../contexts/useComboboxContextValues';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n/**\n * Combobox component: a selection control that allows users to choose from a set of possible options\n */ export const Combobox = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n    const state = useCombobox_unstable(props, ref);\n    const contextValues = useComboboxContextValues(state);\n    useComboboxStyles_unstable(state);\n    useCustomStyleHook_unstable('useComboboxStyles_unstable')(state);\n    return renderCombobox_unstable(state, contextValues);\n});\nCombobox.displayName = 'Combobox';\n"],"names":["Combobox","React","forwardRef","props","ref","state","useCombobox_unstable","contextValues","useComboboxContextValues","useComboboxStyles_unstable","useCustomStyleHook_unstable","renderCombobox_unstable","displayName"],"mappings":";;;;+BAQiBA;;aAAAA;;;6DARM;6BACc;gCACG;yCACG;0CACF;qCACG;AAGjC,MAAMA,WAAW,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAM;IACrE,MAAMC,QAAQC,IAAAA,iCAAoB,EAACH,OAAOC;IAC1C,MAAMG,gBAAgBC,IAAAA,kDAAwB,EAACH;IAC/CI,IAAAA,mDAA0B,EAACJ;IAC3BK,IAAAA,gDAA2B,EAAC,8BAA8BL;IAC1D,OAAOM,IAAAA,uCAAuB,EAACN,OAAOE;AAC1C;AACAP,SAASY,WAAW,GAAG"}

package/lib-commonjs/components/Combobox/Combobox.types.js

@@ -4,6 +4,3 @@ Object.defineProperty(exports, "__esModule", {
 });
 const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
 const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
- //# sourceMappingURL=Combobox.types.js.map
-
-//# sourceMappingURL=Combobox.types.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/Combobox/Combobox.types.js"],"sourcesContent":["import * as React from 'react';\n//# sourceMappingURL=Combobox.types.js.map"],"names":[],"mappings":";;;;;6DAAuB;CACvB,0CAA0C"}
+{"version":3,"sources":["Combobox.types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;6DAAuB"}

package/lib-commonjs/components/Combobox/index.js

@@ -8,6 +8,3 @@ _exportStar(require("./Combobox.types"), exports);
 _exportStar(require("./renderCombobox"), exports);
 _exportStar(require("./useCombobox"), exports);
 _exportStar(require("./useComboboxStyles.styles"), exports);
- //# sourceMappingURL=index.js.map
-
-//# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/Combobox/index.js"],"sourcesContent":["export * from './Combobox';\nexport * from './Combobox.types';\nexport * from './renderCombobox';\nexport * from './useCombobox';\nexport * from './useComboboxStyles.styles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
+{"version":3,"sources":["index.js"],"sourcesContent":["export * from './Combobox';\nexport * from './Combobox.types';\nexport * from './renderCombobox';\nexport * from './useCombobox';\nexport * from './useComboboxStyles.styles';\n"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA"}

package/lib-commonjs/components/Combobox/renderCombobox.js

@@ -15,6 +15,4 @@ const renderCombobox_unstable = (state, contextValues)=>{
     return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.root, slotProps.root, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_comboboxContext.ComboboxContext.Provider, {
         value: contextValues.combobox
     }, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.input, slotProps.input), slots.expandIcon && /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.expandIcon, slotProps.expandIcon), slots.listbox && (state.inlinePopup ? /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.listbox, slotProps.listbox) : /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_reactPortal.Portal, null, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(slots.listbox, slotProps.listbox)))));
-}; //# sourceMappingURL=renderCombobox.js.map
-
-//# sourceMappingURL=renderCombobox.js.map
+};

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/Combobox/renderCombobox.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */import { Portal } from '@fluentui/react-portal';\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { ComboboxContext } from '../../contexts/ComboboxContext';\n/**\n * Render the final JSX of Combobox\n */\nexport const renderCombobox_unstable = (state, contextValues) => {\n  const {\n    slots,\n    slotProps\n  } = getSlotsNext(state);\n  return /*#__PURE__*/createElement(slots.root, slotProps.root, /*#__PURE__*/createElement(ComboboxContext.Provider, {\n    value: contextValues.combobox\n  }, /*#__PURE__*/createElement(slots.input, slotProps.input), slots.expandIcon && /*#__PURE__*/createElement(slots.expandIcon, slotProps.expandIcon), slots.listbox && (state.inlinePopup ? /*#__PURE__*/createElement(slots.listbox, slotProps.listbox) : /*#__PURE__*/createElement(Portal, null, /*#__PURE__*/createElement(slots.listbox, slotProps.listbox)))));\n};\n//# sourceMappingURL=renderCombobox.js.map"],"names":["renderCombobox_unstable","state","contextValues","slots","slotProps","getSlotsNext","createElement","root","ComboboxContext","Provider","value","combobox","input","expandIcon","listbox","inlinePopup","Portal"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAOrCA;;aAAAA;;6BAP8D;iCAC7C;gCACD;iCACG;AAIzB,MAAMA,0BAA0B,CAACC,OAAOC,gBAAkB;IAC/D,MAAM,EACJC,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,4BAAY,EAACJ;IACjB,OAAO,WAAW,GAAEK,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAEH,UAAUG,IAAI,EAAE,WAAW,GAAED,IAAAA,8BAAa,EAACE,gCAAe,CAACC,QAAQ,EAAE;QACjHC,OAAOR,cAAcS,QAAQ;IAC/B,GAAG,WAAW,GAAEL,IAAAA,8BAAa,EAACH,MAAMS,KAAK,EAAER,UAAUQ,KAAK,GAAGT,MAAMU,UAAU,IAAI,WAAW,GAAEP,IAAAA,8BAAa,EAACH,MAAMU,UAAU,EAAET,UAAUS,UAAU,GAAGV,MAAMW,OAAO,IAAKb,CAAAA,MAAMc,WAAW,GAAG,WAAW,GAAET,IAAAA,8BAAa,EAACH,MAAMW,OAAO,EAAEV,UAAUU,OAAO,IAAI,WAAW,GAAER,IAAAA,8BAAa,EAACU,mBAAM,EAAE,IAAI,EAAE,WAAW,GAAEV,IAAAA,8BAAa,EAACH,MAAMW,OAAO,EAAEV,UAAUU,OAAO,EAAE,AAAD;AACjW,GACA,0CAA0C"}
+{"version":3,"sources":["renderCombobox.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { Portal } from '@fluentui/react-portal';\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { ComboboxContext } from '../../contexts/ComboboxContext';\n/**\n * Render the final JSX of Combobox\n */ export const renderCombobox_unstable = (state, contextValues)=>{\n    const { slots , slotProps  } = getSlotsNext(state);\n    return /*#__PURE__*/ createElement(slots.root, slotProps.root, /*#__PURE__*/ createElement(ComboboxContext.Provider, {\n        value: contextValues.combobox\n    }, /*#__PURE__*/ createElement(slots.input, slotProps.input), slots.expandIcon && /*#__PURE__*/ createElement(slots.expandIcon, slotProps.expandIcon), slots.listbox && (state.inlinePopup ? /*#__PURE__*/ createElement(slots.listbox, slotProps.listbox) : /*#__PURE__*/ createElement(Portal, null, /*#__PURE__*/ createElement(slots.listbox, slotProps.listbox)))));\n};\n"],"names":["renderCombobox_unstable","state","contextValues","slots","slotProps","getSlotsNext","createElement","root","ComboboxContext","Provider","value","combobox","input","expandIcon","listbox","inlinePopup","Portal"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAMjCA;;aAAAA;;6BAN2D;iCAC9C;gCACD;iCACG;AAGrB,MAAMA,0BAA0B,CAACC,OAAOC,gBAAgB;IAC/D,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACJ;IAC5C,OAAO,WAAW,GAAGK,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAEH,UAAUG,IAAI,EAAE,WAAW,GAAGD,IAAAA,8BAAa,EAACE,gCAAe,CAACC,QAAQ,EAAE;QACjHC,OAAOR,cAAcS,QAAQ;IACjC,GAAG,WAAW,GAAGL,IAAAA,8BAAa,EAACH,MAAMS,KAAK,EAAER,UAAUQ,KAAK,GAAGT,MAAMU,UAAU,IAAI,WAAW,GAAGP,IAAAA,8BAAa,EAACH,MAAMU,UAAU,EAAET,UAAUS,UAAU,GAAGV,MAAMW,OAAO,IAAKb,CAAAA,MAAMc,WAAW,GAAG,WAAW,GAAGT,IAAAA,8BAAa,EAACH,MAAMW,OAAO,EAAEV,UAAUU,OAAO,IAAI,WAAW,GAAGR,IAAAA,8BAAa,EAACU,mBAAM,EAAE,IAAI,EAAE,WAAW,GAAGV,IAAAA,8BAAa,EAACH,MAAMW,OAAO,EAAEV,UAAUU,OAAO,EAAE,AAAD;AACxW"}

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

@@ -248,6 +248,4 @@ const useCombobox_unstable = (props, ref)=>{
         }
     }
     return state;
-}; //# sourceMappingURL=useCombobox.js.map
-
-//# sourceMappingURL=useCombobox.js.map
+};