@fluentui/react-combobox 9.2.3 → 9.2.5

package/lib-commonjs/utils/dropdownKeyActions.js

@@ -1,94 +1,89 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    getDropdownActionFromKey: ()=>getDropdownActionFromKey,
+    getIndexFromAction: ()=>getIndexFromAction
 });
-exports.getIndexFromAction = exports.getDropdownActionFromKey = void 0;
-const keys = /*#__PURE__*/require("@fluentui/keyboard-keys");
-/**
- * Converts a keyboard interaction into a defined action
- */
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _keyboardKeys = /*#__PURE__*/ _interopRequireWildcard(require("@fluentui/keyboard-keys"));
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 function getDropdownActionFromKey(e, options = {}) {
-  const {
-    open = true,
-    multiselect = false
-  } = options;
-  const code = e.key;
-  const {
-    altKey,
-    ctrlKey,
-    key,
-    metaKey
-  } = e;
-  // typing action occurs whether open or closed
-  if (key.length === 1 && code !== keys.Space && !altKey && !ctrlKey && !metaKey) {
-    return 'Type';
-  }
-  // handle opening the dropdown if closed
-  if (!open) {
-    if (code === keys.ArrowDown || code === keys.ArrowUp || code === keys.Enter || code === keys.Space) {
-      return 'Open';
+    const { open =true , multiselect =false  } = options;
+    const code = e.key;
+    const { altKey , ctrlKey , key , metaKey  } = e;
+    // typing action occurs whether open or closed
+    if (key.length === 1 && code !== _keyboardKeys.Space && !altKey && !ctrlKey && !metaKey) {
+        return 'Type';
+    }
+    // handle opening the dropdown if closed
+    if (!open) {
+        if (code === _keyboardKeys.ArrowDown || code === _keyboardKeys.ArrowUp || code === _keyboardKeys.Enter || code === _keyboardKeys.Space) {
+            return 'Open';
+        }
+        // if the dropdown is closed and an action did not match the above, do nothing
+        return 'None';
+    }
+    // select or close actions
+    if (code === _keyboardKeys.ArrowUp && altKey || code === _keyboardKeys.Enter || !multiselect && code === _keyboardKeys.Space) {
+        return 'CloseSelect';
+    }
+    if (multiselect && code === _keyboardKeys.Space) {
+        return 'Select';
+    }
+    if (code === _keyboardKeys.Escape) {
+        return 'Close';
+    }
+    // navigation interactions
+    if (code === _keyboardKeys.ArrowDown) {
+        return 'Next';
+    }
+    if (code === _keyboardKeys.ArrowUp) {
+        return 'Previous';
     }
-    // if the dropdown is closed and an action did not match the above, do nothing
+    if (code === _keyboardKeys.Home) {
+        return 'First';
+    }
+    if (code === _keyboardKeys.End) {
+        return 'Last';
+    }
+    if (code === _keyboardKeys.PageUp) {
+        return 'PageUp';
+    }
+    if (code === _keyboardKeys.PageDown) {
+        return 'PageDown';
+    }
+    if (code === _keyboardKeys.Tab) {
+        return 'Tab';
+    }
+    // if nothing matched, return none
     return 'None';
-  }
-  // select or close actions
-  if (code === keys.ArrowUp && altKey || code === keys.Enter || !multiselect && code === keys.Space) {
-    return 'CloseSelect';
-  }
-  if (multiselect && code === keys.Space) {
-    return 'Select';
-  }
-  if (code === keys.Escape) {
-    return 'Close';
-  }
-  // navigation interactions
-  if (code === keys.ArrowDown) {
-    return 'Next';
-  }
-  if (code === keys.ArrowUp) {
-    return 'Previous';
-  }
-  if (code === keys.Home) {
-    return 'First';
-  }
-  if (code === keys.End) {
-    return 'Last';
-  }
-  if (code === keys.PageUp) {
-    return 'PageUp';
-  }
-  if (code === keys.PageDown) {
-    return 'PageDown';
-  }
-  if (code === keys.Tab) {
-    return 'Tab';
-  }
-  // if nothing matched, return none
-  return 'None';
 }
-exports.getDropdownActionFromKey = getDropdownActionFromKey;
-/**
- * Returns the requested option index from an action
- */
 function getIndexFromAction(action, currentIndex, maxIndex) {
-  switch (action) {
-    case 'Next':
-      return Math.min(maxIndex, currentIndex + 1);
-      break;
-    case 'Previous':
-      return Math.max(0, currentIndex - 1);
-    case 'First':
-      return 0;
-    case 'Last':
-      return maxIndex;
-    case 'PageDown':
-      return Math.min(maxIndex, currentIndex + 10);
-    case 'PageUp':
-      return Math.max(0, currentIndex - 10);
-    default:
-      return currentIndex;
-  }
-}
-exports.getIndexFromAction = getIndexFromAction;
+    switch(action){
+        case 'Next':
+            return Math.min(maxIndex, currentIndex + 1);
+            break;
+        case 'Previous':
+            return Math.max(0, currentIndex - 1);
+        case 'First':
+            return 0;
+        case 'Last':
+            return maxIndex;
+        case 'PageDown':
+            return Math.min(maxIndex, currentIndex + 10);
+        case 'PageUp':
+            return Math.max(0, currentIndex - 10);
+        default:
+            return currentIndex;
+    }
+} //# sourceMappingURL=dropdownKeyActions.js.map
+
 //# sourceMappingURL=dropdownKeyActions.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["keys","require","getDropdownActionFromKey","e","options","open","multiselect","code","key","altKey","ctrlKey","metaKey","length","Space","ArrowDown","ArrowUp","Enter","Escape","Home","End","PageUp","PageDown","Tab","exports","getIndexFromAction","action","currentIndex","maxIndex","Math","min","max"],"sources":["../src/packages/react-components/react-combobox/src/utils/dropdownKeyActions.ts"],"sourcesContent":["import * as keys from '@fluentui/keyboard-keys';\nimport * as React from 'react';\n\n/**\n * enum of actions available in any type of managed dropdown control\n * e.g. combobox, select, datepicker, menu\n */\nexport type DropdownActions =\n  | 'Close'\n  | 'CloseSelect'\n  | 'First'\n  | 'Last'\n  | 'Next'\n  | 'None'\n  | 'Open'\n  | 'PageDown'\n  | 'PageUp'\n  | 'Previous'\n  | 'Select'\n  | 'Tab'\n  | 'Type';\n\nexport interface DropdownActionOptions {\n  open?: boolean;\n  multiselect?: boolean;\n}\n\n/**\n * Converts a keyboard interaction into a defined action\n */\nexport function getDropdownActionFromKey(\n  e: KeyboardEvent | React.KeyboardEvent,\n  options: DropdownActionOptions = {},\n): DropdownActions {\n  const { open = true, multiselect = false } = options;\n  const code = e.key;\n  const { altKey, ctrlKey, key, metaKey } = e;\n\n  // typing action occurs whether open or closed\n  if (key.length === 1 && code !== keys.Space && !altKey && !ctrlKey && !metaKey) {\n    return 'Type';\n  }\n\n  // handle opening the dropdown if closed\n  if (!open) {\n    if (code === keys.ArrowDown || code === keys.ArrowUp || code === keys.Enter || code === keys.Space) {\n      return 'Open';\n    }\n\n    // if the dropdown is closed and an action did not match the above, do nothing\n    return 'None';\n  }\n\n  // select or close actions\n  if ((code === keys.ArrowUp && altKey) || code === keys.Enter || (!multiselect && code === keys.Space)) {\n    return 'CloseSelect';\n  }\n  if (multiselect && code === keys.Space) {\n    return 'Select';\n  }\n  if (code === keys.Escape) {\n    return 'Close';\n  }\n\n  // navigation interactions\n  if (code === keys.ArrowDown) {\n    return 'Next';\n  }\n  if (code === keys.ArrowUp) {\n    return 'Previous';\n  }\n  if (code === keys.Home) {\n    return 'First';\n  }\n  if (code === keys.End) {\n    return 'Last';\n  }\n  if (code === keys.PageUp) {\n    return 'PageUp';\n  }\n  if (code === keys.PageDown) {\n    return 'PageDown';\n  }\n  if (code === keys.Tab) {\n    return 'Tab';\n  }\n\n  // if nothing matched, return none\n  return 'None';\n}\n\n/**\n * Returns the requested option index from an action\n */\nexport function getIndexFromAction(action: DropdownActions, currentIndex: number, maxIndex: number): number {\n  switch (action) {\n    case 'Next':\n      return Math.min(maxIndex, currentIndex + 1);\n      break;\n    case 'Previous':\n      return Math.max(0, currentIndex - 1);\n    case 'First':\n      return 0;\n    case 'Last':\n      return maxIndex;\n    case 'PageDown':\n      return Math.min(maxIndex, currentIndex + 10);\n    case 'PageUp':\n      return Math.max(0, currentIndex - 10);\n    default:\n      return currentIndex;\n  }\n}\n"],"mappings":";;;;;;AAAA,MAAAA,IAAA,gBAAAC,OAAA;AA2BA;;;AAGA,SAAgBC,wBAAwBA,CACtCC,CAAsC,EACtCC,OAAA,GAAiC,EAAE;EAEnC,MAAM;IAAEC,IAAI,GAAG,IAAI;IAAEC,WAAW,GAAG;EAAK,CAAE,GAAGF,OAAO;EACpD,MAAMG,IAAI,GAAGJ,CAAC,CAACK,GAAG;EAClB,MAAM;IAAEC,MAAM;IAAEC,OAAO;IAAEF,GAAG;IAAEG;EAAO,CAAE,GAAGR,CAAC;EAE3C;EACA,IAAIK,GAAG,CAACI,MAAM,KAAK,CAAC,IAAIL,IAAI,KAAKP,IAAI,CAACa,KAAK,IAAI,CAACJ,MAAM,IAAI,CAACC,OAAO,IAAI,CAACC,OAAO,EAAE;IAC9E,OAAO,MAAM;;EAGf;EACA,IAAI,CAACN,IAAI,EAAE;IACT,IAAIE,IAAI,KAAKP,IAAI,CAACc,SAAS,IAAIP,IAAI,KAAKP,IAAI,CAACe,OAAO,IAAIR,IAAI,KAAKP,IAAI,CAACgB,KAAK,IAAIT,IAAI,KAAKP,IAAI,CAACa,KAAK,EAAE;MAClG,OAAO,MAAM;;IAGf;IACA,OAAO,MAAM;;EAGf;EACA,IAAKN,IAAI,KAAKP,IAAI,CAACe,OAAO,IAAIN,MAAM,IAAKF,IAAI,KAAKP,IAAI,CAACgB,KAAK,IAAK,CAACV,WAAW,IAAIC,IAAI,KAAKP,IAAI,CAACa,KAAM,EAAE;IACrG,OAAO,aAAa;;EAEtB,IAAIP,WAAW,IAAIC,IAAI,KAAKP,IAAI,CAACa,KAAK,EAAE;IACtC,OAAO,QAAQ;;EAEjB,IAAIN,IAAI,KAAKP,IAAI,CAACiB,MAAM,EAAE;IACxB,OAAO,OAAO;;EAGhB;EACA,IAAIV,IAAI,KAAKP,IAAI,CAACc,SAAS,EAAE;IAC3B,OAAO,MAAM;;EAEf,IAAIP,IAAI,KAAKP,IAAI,CAACe,OAAO,EAAE;IACzB,OAAO,UAAU;;EAEnB,IAAIR,IAAI,KAAKP,IAAI,CAACkB,IAAI,EAAE;IACtB,OAAO,OAAO;;EAEhB,IAAIX,IAAI,KAAKP,IAAI,CAACmB,GAAG,EAAE;IACrB,OAAO,MAAM;;EAEf,IAAIZ,IAAI,KAAKP,IAAI,CAACoB,MAAM,EAAE;IACxB,OAAO,QAAQ;;EAEjB,IAAIb,IAAI,KAAKP,IAAI,CAACqB,QAAQ,EAAE;IAC1B,OAAO,UAAU;;EAEnB,IAAId,IAAI,KAAKP,IAAI,CAACsB,GAAG,EAAE;IACrB,OAAO,KAAK;;EAGd;EACA,OAAO,MAAM;AACf;AA3DAC,OAAA,CAAArB,wBAAA,GAAAA,wBAAA;AA6DA;;;AAGA,SAAgBsB,kBAAkBA,CAACC,MAAuB,EAAEC,YAAoB,EAAEC,QAAgB;EAChG,QAAQF,MAAM;IACZ,KAAK,MAAM;MACT,OAAOG,IAAI,CAACC,GAAG,CAACF,QAAQ,EAAED,YAAY,GAAG,CAAC,CAAC;MAC3C;IACF,KAAK,UAAU;MACb,OAAOE,IAAI,CAACE,GAAG,CAAC,CAAC,EAAEJ,YAAY,GAAG,CAAC,CAAC;IACtC,KAAK,OAAO;MACV,OAAO,CAAC;IACV,KAAK,MAAM;MACT,OAAOC,QAAQ;IACjB,KAAK,UAAU;MACb,OAAOC,IAAI,CAACC,GAAG,CAACF,QAAQ,EAAED,YAAY,GAAG,EAAE,CAAC;IAC9C,KAAK,QAAQ;MACX,OAAOE,IAAI,CAACE,GAAG,CAAC,CAAC,EAAEJ,YAAY,GAAG,EAAE,CAAC;IACvC;MACE,OAAOA,YAAY;EAAC;AAE1B;AAlBAH,OAAA,CAAAC,kBAAA,GAAAA,kBAAA"}
+{"version":3,"sources":["../../lib/utils/dropdownKeyActions.js"],"sourcesContent":["import * as keys from '@fluentui/keyboard-keys';\nimport * as React from 'react';\n/**\n * Converts a keyboard interaction into a defined action\n */\nexport function getDropdownActionFromKey(e, options = {}) {\n  const {\n    open = true,\n    multiselect = false\n  } = options;\n  const code = e.key;\n  const {\n    altKey,\n    ctrlKey,\n    key,\n    metaKey\n  } = e;\n  // typing action occurs whether open or closed\n  if (key.length === 1 && code !== keys.Space && !altKey && !ctrlKey && !metaKey) {\n    return 'Type';\n  }\n  // handle opening the dropdown if closed\n  if (!open) {\n    if (code === keys.ArrowDown || code === keys.ArrowUp || code === keys.Enter || code === keys.Space) {\n      return 'Open';\n    }\n    // if the dropdown is closed and an action did not match the above, do nothing\n    return 'None';\n  }\n  // select or close actions\n  if (code === keys.ArrowUp && altKey || code === keys.Enter || !multiselect && code === keys.Space) {\n    return 'CloseSelect';\n  }\n  if (multiselect && code === keys.Space) {\n    return 'Select';\n  }\n  if (code === keys.Escape) {\n    return 'Close';\n  }\n  // navigation interactions\n  if (code === keys.ArrowDown) {\n    return 'Next';\n  }\n  if (code === keys.ArrowUp) {\n    return 'Previous';\n  }\n  if (code === keys.Home) {\n    return 'First';\n  }\n  if (code === keys.End) {\n    return 'Last';\n  }\n  if (code === keys.PageUp) {\n    return 'PageUp';\n  }\n  if (code === keys.PageDown) {\n    return 'PageDown';\n  }\n  if (code === keys.Tab) {\n    return 'Tab';\n  }\n  // if nothing matched, return none\n  return 'None';\n}\n/**\n * Returns the requested option index from an action\n */\nexport function getIndexFromAction(action, currentIndex, maxIndex) {\n  switch (action) {\n    case 'Next':\n      return Math.min(maxIndex, currentIndex + 1);\n      break;\n    case 'Previous':\n      return Math.max(0, currentIndex - 1);\n    case 'First':\n      return 0;\n    case 'Last':\n      return maxIndex;\n    case 'PageDown':\n      return Math.min(maxIndex, currentIndex + 10);\n    case 'PageUp':\n      return Math.max(0, currentIndex - 10);\n    default:\n      return currentIndex;\n  }\n}\n//# sourceMappingURL=dropdownKeyActions.js.map"],"names":["getDropdownActionFromKey","getIndexFromAction","e","options","open","multiselect","code","key","altKey","ctrlKey","metaKey","length","keys","Space","ArrowDown","ArrowUp","Enter","Escape","Home","End","PageUp","PageDown","Tab","action","currentIndex","maxIndex","Math","min","max"],"mappings":";;;;;;;;;;;IAKgBA,wBAAwB,MAAxBA;IA8DAC,kBAAkB,MAAlBA;;;oEAnEM;6DACC;AAIhB,SAASD,yBAAyBE,CAAC,EAAEC,UAAU,CAAC,CAAC,EAAE;IACxD,MAAM,EACJC,MAAO,IAAI,CAAA,EACXC,aAAc,KAAK,CAAA,EACpB,GAAGF;IACJ,MAAMG,OAAOJ,EAAEK,GAAG;IAClB,MAAM,EACJC,OAAM,EACNC,QAAO,EACPF,IAAG,EACHG,QAAO,EACR,GAAGR;IACJ,8CAA8C;IAC9C,IAAIK,IAAII,MAAM,KAAK,KAAKL,SAASM,cAAKC,KAAK,IAAI,CAACL,UAAU,CAACC,WAAW,CAACC,SAAS;QAC9E,OAAO;IACT,CAAC;IACD,wCAAwC;IACxC,IAAI,CAACN,MAAM;QACT,IAAIE,SAASM,cAAKE,SAAS,IAAIR,SAASM,cAAKG,OAAO,IAAIT,SAASM,cAAKI,KAAK,IAAIV,SAASM,cAAKC,KAAK,EAAE;YAClG,OAAO;QACT,CAAC;QACD,8EAA8E;QAC9E,OAAO;IACT,CAAC;IACD,0BAA0B;IAC1B,IAAIP,SAASM,cAAKG,OAAO,IAAIP,UAAUF,SAASM,cAAKI,KAAK,IAAI,CAACX,eAAeC,SAASM,cAAKC,KAAK,EAAE;QACjG,OAAO;IACT,CAAC;IACD,IAAIR,eAAeC,SAASM,cAAKC,KAAK,EAAE;QACtC,OAAO;IACT,CAAC;IACD,IAAIP,SAASM,cAAKK,MAAM,EAAE;QACxB,OAAO;IACT,CAAC;IACD,0BAA0B;IAC1B,IAAIX,SAASM,cAAKE,SAAS,EAAE;QAC3B,OAAO;IACT,CAAC;IACD,IAAIR,SAASM,cAAKG,OAAO,EAAE;QACzB,OAAO;IACT,CAAC;IACD,IAAIT,SAASM,cAAKM,IAAI,EAAE;QACtB,OAAO;IACT,CAAC;IACD,IAAIZ,SAASM,cAAKO,GAAG,EAAE;QACrB,OAAO;IACT,CAAC;IACD,IAAIb,SAASM,cAAKQ,MAAM,EAAE;QACxB,OAAO;IACT,CAAC;IACD,IAAId,SAASM,cAAKS,QAAQ,EAAE;QAC1B,OAAO;IACT,CAAC;IACD,IAAIf,SAASM,cAAKU,GAAG,EAAE;QACrB,OAAO;IACT,CAAC;IACD,kCAAkC;IAClC,OAAO;AACT;AAIO,SAASrB,mBAAmBsB,MAAM,EAAEC,YAAY,EAAEC,QAAQ,EAAE;IACjE,OAAQF;QACN,KAAK;YACH,OAAOG,KAAKC,GAAG,CAACF,UAAUD,eAAe;YACzC,KAAM;QACR,KAAK;YACH,OAAOE,KAAKE,GAAG,CAAC,GAAGJ,eAAe;QACpC,KAAK;YACH,OAAO;QACT,KAAK;YACH,OAAOC;QACT,KAAK;YACH,OAAOC,KAAKC,GAAG,CAACF,UAAUD,eAAe;QAC3C,KAAK;YACH,OAAOE,KAAKE,GAAG,CAAC,GAAGJ,eAAe;QACpC;YACE,OAAOA;IACX;AACF,EACA,8CAA8C"}

package/lib-commonjs/utils/internalTokens.js

@@ -1,12 +1,15 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "iconSizes", {
+    enumerable: true,
+    get: ()=>iconSizes
 });
-exports.iconSizes = void 0;
-exports.iconSizes = {
-  small: '16px',
-  medium: '20px',
-  large: '24px'
-};
+const iconSizes = {
+    small: '16px',
+    medium: '20px',
+    large: '24px'
+}; //# sourceMappingURL=internalTokens.js.map
+
 //# sourceMappingURL=internalTokens.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["exports","iconSizes","small","medium","large"],"sources":["../src/packages/react-components/react-combobox/src/utils/internalTokens.ts"],"sourcesContent":["export const iconSizes = {\n  small: '16px',\n  medium: '20px',\n  large: '24px',\n};\n"],"mappings":";;;;;;AAAaA,OAAA,CAAAC,SAAS,GAAG;EACvBC,KAAK,EAAE,MAAM;EACbC,MAAM,EAAE,MAAM;EACdC,KAAK,EAAE;CACR"}
+{"version":3,"sources":["../../lib/utils/internalTokens.js"],"sourcesContent":["export const iconSizes = {\n  small: '16px',\n  medium: '20px',\n  large: '24px'\n};\n//# sourceMappingURL=internalTokens.js.map"],"names":["iconSizes","small","medium","large"],"mappings":";;;;+BAAaA;;aAAAA;;AAAN,MAAMA,YAAY;IACvBC,OAAO;IACPC,QAAQ;IACRC,OAAO;AACT,GACA,0CAA0C"}

package/lib-commonjs/utils/useComboboxBaseState.js

@@ -1,119 +1,117 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "useComboboxBaseState", {
+    enumerable: true,
+    get: ()=>useComboboxBaseState
 });
-exports.useComboboxBaseState = void 0;
-const React = /*#__PURE__*/require("react");
-const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
-const useOptionCollection_1 = /*#__PURE__*/require("../utils/useOptionCollection");
-const useSelection_1 = /*#__PURE__*/require("../utils/useSelection");
-/**
- * State shared between Combobox and Dropdown components
- */
-const useComboboxBaseState = props => {
-  const {
-    appearance = 'outline',
-    children,
-    editable = false,
-    inlinePopup = false,
-    multiselect,
-    onOpenChange,
-    size = 'medium'
-  } = props;
-  const optionCollection = useOptionCollection_1.useOptionCollection();
-  const {
-    getOptionAtIndex,
-    getOptionsMatchingValue
-  } = optionCollection;
-  const [activeOption, setActiveOption] = React.useState();
-  // track whether keyboard focus outline should be shown
-  // tabster/keyborg doesn't work here, since the actual keyboard focus target doesn't move
-  const [focusVisible, setFocusVisible] = React.useState(false);
-  // track focused state to conditionally render collapsed listbox
-  const [hasFocus, setHasFocus] = React.useState(false);
-  const ignoreNextBlur = React.useRef(false);
-  const selectionState = useSelection_1.useSelection(props);
-  const {
-    selectedOptions
-  } = selectionState;
-  // calculate value based on props, internal value changes, and selected options
-  const isFirstMount = react_utilities_1.useFirstMount();
-  const [controllableValue, setValue] = react_utilities_1.useControllableState({
-    state: props.value,
-    initialState: undefined
-  });
-  const value = React.useMemo(() => {
-    // don't compute the value if it is defined through props or setValue,
-    if (controllableValue !== undefined) {
-      return controllableValue;
-    }
-    // handle defaultValue here, so it is overridden by selection
-    if (isFirstMount && props.defaultValue !== undefined) {
-      return props.defaultValue;
-    }
-    const selectedOptionsText = getOptionsMatchingValue(optionValue => {
-      return selectedOptions.includes(optionValue);
-    }).map(option => option.text);
-    if (multiselect) {
-      // editable inputs should not display multiple selected options in the input as text
-      return editable ? '' : selectedOptionsText.join(', ');
-    }
-    return selectedOptionsText[0];
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _reactUtilities = require("@fluentui/react-utilities");
+const _useOptionCollection = require("../utils/useOptionCollection");
+const _useSelection = require("../utils/useSelection");
+const useComboboxBaseState = (props)=>{
+    const { appearance ='outline' , children , editable =false , inlinePopup =false , multiselect , onOpenChange , size ='medium'  } = props;
+    const optionCollection = (0, _useOptionCollection.useOptionCollection)();
+    const { getOptionAtIndex , getOptionsMatchingValue  } = optionCollection;
+    const [activeOption, setActiveOption] = _react.useState();
+    // track whether keyboard focus outline should be shown
+    // tabster/keyborg doesn't work here, since the actual keyboard focus target doesn't move
+    const [focusVisible, setFocusVisible] = _react.useState(false);
+    // track focused state to conditionally render collapsed listbox
+    const [hasFocus, setHasFocus] = _react.useState(false);
+    const ignoreNextBlur = _react.useRef(false);
+    const selectionState = (0, _useSelection.useSelection)(props);
+    const { selectedOptions  } = selectionState;
+    // calculate value based on props, internal value changes, and selected options
+    const isFirstMount = (0, _reactUtilities.useFirstMount)();
+    const [controllableValue, setValue] = (0, _reactUtilities.useControllableState)({
+        state: props.value,
+        initialState: undefined
+    });
+    const value = _react.useMemo(()=>{
+        // don't compute the value if it is defined through props or setValue,
+        if (controllableValue !== undefined) {
+            return controllableValue;
+        }
+        // handle defaultValue here, so it is overridden by selection
+        if (isFirstMount && props.defaultValue !== undefined) {
+            return props.defaultValue;
+        }
+        const selectedOptionsText = getOptionsMatchingValue((optionValue)=>{
+            return selectedOptions.includes(optionValue);
+        }).map((option)=>option.text);
+        if (multiselect) {
+            // editable inputs should not display multiple selected options in the input as text
+            return editable ? '' : selectedOptionsText.join(', ');
+        }
+        return selectedOptionsText[0];
     // do not change value after isFirstMount changes,
     // we do not want to accidentally override defaultValue on a second render
     // unless another value is intentionally set
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [controllableValue, editable, getOptionsMatchingValue, multiselect, props.defaultValue, selectedOptions]);
-  // Handle open state, which is shared with options in context
-  const [open, setOpenState] = react_utilities_1.useControllableState({
-    state: props.open,
-    defaultState: props.defaultOpen,
-    initialState: false
-  });
-  const setOpen = React.useCallback((event, newState) => {
-    onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(event, {
-      open: newState
+    }, [
+        controllableValue,
+        editable,
+        getOptionsMatchingValue,
+        multiselect,
+        props.defaultValue,
+        selectedOptions
+    ]);
+    // Handle open state, which is shared with options in context
+    const [open, setOpenState] = (0, _reactUtilities.useControllableState)({
+        state: props.open,
+        defaultState: props.defaultOpen,
+        initialState: false
     });
-    setOpenState(newState);
-  }, [onOpenChange, setOpenState]);
-  // update active option based on change in open state or children
-  React.useEffect(() => {
-    if (open && !activeOption) {
-      // if it is single-select and there is a selected option, start at the selected option
-      if (!multiselect && selectedOptions.length > 0) {
-        const selectedOption = getOptionsMatchingValue(v => v === selectedOptions[0]).pop();
-        selectedOption && setActiveOption(selectedOption);
-      }
-      // default to starting at the first option
-      else {
-        setActiveOption(getOptionAtIndex(0));
-      }
-    } else if (!open) {
-      // reset the active option when closing
-      setActiveOption(undefined);
-    }
+    const setOpen = _react.useCallback((event, newState)=>{
+        onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(event, {
+            open: newState
+        });
+        setOpenState(newState);
+    }, [
+        onOpenChange,
+        setOpenState
+    ]);
+    // update active option based on change in open state or children
+    _react.useEffect(()=>{
+        if (open && !activeOption) {
+            // if it is single-select and there is a selected option, start at the selected option
+            if (!multiselect && selectedOptions.length > 0) {
+                const selectedOption = getOptionsMatchingValue((v)=>v === selectedOptions[0]).pop();
+                selectedOption && setActiveOption(selectedOption);
+            } else {
+                setActiveOption(getOptionAtIndex(0));
+            }
+        } else if (!open) {
+            // reset the active option when closing
+            setActiveOption(undefined);
+        }
     // this should only be run in response to changes in the open state or children
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [open, children]);
-  return {
-    ...optionCollection,
-    ...selectionState,
-    activeOption,
-    appearance,
-    focusVisible,
-    hasFocus,
-    ignoreNextBlur,
-    inlinePopup,
-    open,
-    setActiveOption,
-    setFocusVisible,
-    setHasFocus,
-    setOpen,
-    setValue,
-    size,
-    value
-  };
-};
-exports.useComboboxBaseState = useComboboxBaseState;
+    }, [
+        open,
+        children
+    ]);
+    return {
+        ...optionCollection,
+        ...selectionState,
+        activeOption,
+        appearance,
+        focusVisible,
+        hasFocus,
+        ignoreNextBlur,
+        inlinePopup,
+        open,
+        setActiveOption,
+        setFocusVisible,
+        setHasFocus,
+        setOpen,
+        setValue,
+        size,
+        value
+    };
+}; //# sourceMappingURL=useComboboxBaseState.js.map
+
 //# sourceMappingURL=useComboboxBaseState.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","require","react_utilities_1","useOptionCollection_1","useSelection_1","useComboboxBaseState","props","appearance","children","editable","inlinePopup","multiselect","onOpenChange","size","optionCollection","useOptionCollection","getOptionAtIndex","getOptionsMatchingValue","activeOption","setActiveOption","useState","focusVisible","setFocusVisible","hasFocus","setHasFocus","ignoreNextBlur","useRef","selectionState","useSelection","selectedOptions","isFirstMount","useFirstMount","controllableValue","setValue","useControllableState","state","value","initialState","undefined","useMemo","defaultValue","selectedOptionsText","optionValue","includes","map","option","text","join","open","setOpenState","defaultState","defaultOpen","setOpen","useCallback","event","newState","useEffect","length","selectedOption","v","pop","exports"],"sources":["../src/packages/react-components/react-combobox/src/utils/useComboboxBaseState.ts"],"sourcesContent":["import * as React from 'react';\nimport { useControllableState, useFirstMount } from '@fluentui/react-utilities';\nimport { useOptionCollection } from '../utils/useOptionCollection';\nimport { OptionValue } from '../utils/OptionCollection.types';\nimport { useSelection } from '../utils/useSelection';\nimport type { ComboboxBaseProps, ComboboxBaseOpenEvents, ComboboxBaseState } from './ComboboxBase.types';\n\n/**\n * State shared between Combobox and Dropdown components\n */\nexport const useComboboxBaseState = (\n  props: ComboboxBaseProps & { children?: React.ReactNode; editable?: boolean },\n): ComboboxBaseState => {\n  const {\n    appearance = 'outline',\n    children,\n    editable = false,\n    inlinePopup = false,\n    multiselect,\n    onOpenChange,\n    size = 'medium',\n  } = props;\n\n  const optionCollection = useOptionCollection();\n  const { getOptionAtIndex, getOptionsMatchingValue } = optionCollection;\n\n  const [activeOption, setActiveOption] = React.useState<OptionValue | undefined>();\n\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\n  // track focused state to conditionally render collapsed listbox\n  const [hasFocus, setHasFocus] = React.useState(false);\n\n  const ignoreNextBlur = React.useRef(false);\n\n  const selectionState = useSelection(props);\n  const { selectedOptions } = selectionState;\n\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\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\n    // handle defaultValue here, so it is overridden by selection\n    if (isFirstMount && props.defaultValue !== undefined) {\n      return props.defaultValue;\n    }\n\n    const selectedOptionsText = getOptionsMatchingValue(optionValue => {\n      return selectedOptions.includes(optionValue);\n    }).map(option => option.text);\n\n    if (multiselect) {\n      // editable inputs should not display multiple selected options in the input as text\n      return editable ? '' : selectedOptionsText.join(', ');\n    }\n\n    return selectedOptionsText[0];\n\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  }, [controllableValue, editable, getOptionsMatchingValue, multiselect, props.defaultValue, 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\n  const setOpen = React.useCallback(\n    (event: ComboboxBaseOpenEvents, newState: boolean) => {\n      onOpenChange?.(event, { open: newState });\n      setOpenState(newState);\n    },\n    [onOpenChange, setOpenState],\n  );\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      }\n      // default to starting at the first option\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  }, [open, children]);\n\n  return {\n    ...optionCollection,\n    ...selectionState,\n    activeOption,\n    appearance,\n    focusVisible,\n    hasFocus,\n    ignoreNextBlur,\n    inlinePopup,\n    open,\n    setActiveOption,\n    setFocusVisible,\n    setHasFocus,\n    setOpen,\n    setValue,\n    size,\n    value,\n  };\n};\n"],"mappings":"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"}
+{"version":3,"sources":["../../lib/utils/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 */\nexport const useComboboxBaseState = props => {\n  const {\n    appearance = 'outline',\n    children,\n    editable = false,\n    inlinePopup = false,\n    multiselect,\n    onOpenChange,\n    size = 'medium'\n  } = props;\n  const optionCollection = useOptionCollection();\n  const {\n    getOptionAtIndex,\n    getOptionsMatchingValue\n  } = 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 {\n    selectedOptions\n  } = 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  }, [controllableValue, editable, getOptionsMatchingValue, multiselect, props.defaultValue, selectedOptions]);\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  }, [onOpenChange, setOpenState]);\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  }, [open, children]);\n  return {\n    ...optionCollection,\n    ...selectionState,\n    activeOption,\n    appearance,\n    focusVisible,\n    hasFocus,\n    ignoreNextBlur,\n    inlinePopup,\n    open,\n    setActiveOption,\n    setFocusVisible,\n    setHasFocus,\n    setOpen,\n    setValue,\n    size,\n    value\n  };\n};\n//# sourceMappingURL=useComboboxBaseState.js.map"],"names":["useComboboxBaseState","props","appearance","children","editable","inlinePopup","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","undefined","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

@@ -1,38 +1,38 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
+});
+Object.defineProperty(exports, "useComboboxPopup", {
+    enumerable: true,
+    get: ()=>useComboboxPopup
 });
-exports.useComboboxPopup = void 0;
-const react_positioning_1 = /*#__PURE__*/require("@fluentui/react-positioning");
-const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
+const _reactPositioning = require("@fluentui/react-positioning");
+const _reactUtilities = require("@fluentui/react-utilities");
 function useComboboxPopup(props, triggerShorthand, listboxShorthand) {
-  const {
-    positioning
-  } = props;
-  // popper options
-  const popperOptions = {
-    position: 'below',
-    align: 'start',
-    offset: {
-      crossAxis: 0,
-      mainAxis: 2
-    },
-    ...react_positioning_1.resolvePositioningShorthand(positioning)
-  };
-  const {
-    targetRef,
-    containerRef
-  } = react_positioning_1.usePositioning(popperOptions);
-  const listboxRef = react_utilities_1.useMergedRefs(listboxShorthand === null || listboxShorthand === void 0 ? void 0 : listboxShorthand.ref, containerRef);
-  const listbox = listboxShorthand && {
-    ...listboxShorthand,
-    ref: listboxRef
-  };
-  return [{
-    ...triggerShorthand,
-    ref: react_utilities_1.useMergedRefs(triggerShorthand === null || triggerShorthand === void 0 ? void 0 : triggerShorthand.ref, targetRef)
-  }, listbox];
-}
-exports.useComboboxPopup = useComboboxPopup;
+    const { positioning  } = props;
+    // popper options
+    const popperOptions = {
+        position: 'below',
+        align: 'start',
+        offset: {
+            crossAxis: 0,
+            mainAxis: 2
+        },
+        ...(0, _reactPositioning.resolvePositioningShorthand)(positioning)
+    };
+    const { targetRef , containerRef  } = (0, _reactPositioning.usePositioning)(popperOptions);
+    const listboxRef = (0, _reactUtilities.useMergedRefs)(listboxShorthand === null || listboxShorthand === void 0 ? void 0 : listboxShorthand.ref, containerRef);
+    const listbox = listboxShorthand && {
+        ...listboxShorthand,
+        ref: listboxRef
+    };
+    return [
+        {
+            ...triggerShorthand,
+            ref: (0, _reactUtilities.useMergedRefs)(triggerShorthand === null || triggerShorthand === void 0 ? void 0 : triggerShorthand.ref, targetRef)
+        },
+        listbox
+    ];
+} //# sourceMappingURL=useComboboxPopup.js.map
+
 //# sourceMappingURL=useComboboxPopup.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["react_positioning_1","require","react_utilities_1","useComboboxPopup","props","triggerShorthand","listboxShorthand","positioning","popperOptions","position","align","offset","crossAxis","mainAxis","resolvePositioningShorthand","targetRef","containerRef","usePositioning","listboxRef","useMergedRefs","ref","listbox","exports"],"sources":["../src/packages/react-components/react-combobox/src/utils/useComboboxPopup.ts"],"sourcesContent":["import { resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport { ExtractSlotProps, Slot, useMergedRefs } from '@fluentui/react-utilities';\nimport type { ComboboxBaseProps } from './ComboboxBase.types';\nimport { Listbox } from '../components/Listbox/Listbox';\n\nexport function useComboboxPopup(\n  props: ComboboxBaseProps,\n  triggerShorthand?: ExtractSlotProps<Slot<'button'>>,\n  listboxShorthand?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [trigger: ExtractSlotProps<Slot<'button'>>, listbox?: ExtractSlotProps<Slot<typeof Listbox>>];\nexport function useComboboxPopup(\n  props: ComboboxBaseProps,\n  triggerShorthand?: ExtractSlotProps<Slot<'input'>>,\n  listboxShorthand?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [trigger: ExtractSlotProps<Slot<'input'>>, listbox?: ExtractSlotProps<Slot<typeof Listbox>>];\n\nexport function useComboboxPopup(\n  props: ComboboxBaseProps,\n  triggerShorthand?: ExtractSlotProps<Slot<'input'>> | ExtractSlotProps<Slot<'button'>>,\n  listboxShorthand?: ExtractSlotProps<Slot<typeof Listbox>>,\n): [\n  trigger: ExtractSlotProps<Slot<'input'>> | ExtractSlotProps<Slot<'button'>>,\n  listbox?: ExtractSlotProps<Slot<typeof Listbox>>,\n] {\n  const { positioning } = props;\n\n  // popper options\n  const popperOptions = {\n    position: 'below' as const,\n    align: 'start' as const,\n    offset: { crossAxis: 0, mainAxis: 2 },\n    ...resolvePositioningShorthand(positioning),\n  };\n\n  const { targetRef, containerRef } = usePositioning(popperOptions);\n\n  const listboxRef = useMergedRefs(listboxShorthand?.ref, containerRef);\n  const listbox = listboxShorthand && { ...listboxShorthand, ref: listboxRef };\n\n  return [{ ...triggerShorthand, ref: useMergedRefs(triggerShorthand?.ref, targetRef) }, listbox];\n}\n"],"mappings":";;;;;;AAAA,MAAAA,mBAAA,gBAAAC,OAAA;AACA,MAAAC,iBAAA,gBAAAD,OAAA;AAeA,SAAgBE,gBAAgBA,CAC9BC,KAAwB,EACxBC,gBAAqF,EACrFC,gBAAyD;EAKzD,MAAM;IAAEC;EAAW,CAAE,GAAGH,KAAK;EAE7B;EACA,MAAMI,aAAa,GAAG;IACpBC,QAAQ,EAAE,OAAgB;IAC1BC,KAAK,EAAE,OAAgB;IACvBC,MAAM,EAAE;MAAEC,SAAS,EAAE,CAAC;MAAEC,QAAQ,EAAE;IAAC,CAAE;IACrC,GAAGb,mBAAA,CAAAc,2BAA2B,CAACP,WAAW;GAC3C;EAED,MAAM;IAAEQ,SAAS;IAAEC;EAAY,CAAE,GAAGhB,mBAAA,CAAAiB,cAAc,CAACT,aAAa,CAAC;EAEjE,MAAMU,UAAU,GAAGhB,iBAAA,CAAAiB,aAAa,CAACb,gBAAgB,aAAhBA,gBAAgB,uBAAhBA,gBAAgB,CAAEc,GAAG,EAAEJ,YAAY,CAAC;EACrE,MAAMK,OAAO,GAAGf,gBAAgB,IAAI;IAAE,GAAGA,gBAAgB;IAAEc,GAAG,EAAEF;EAAU,CAAE;EAE5E,OAAO,CAAC;IAAE,GAAGb,gBAAgB;IAAEe,GAAG,EAAElB,iBAAA,CAAAiB,aAAa,CAACd,gBAAgB,aAAhBA,gBAAgB,uBAAhBA,gBAAgB,CAAEe,GAAG,EAAEL,SAAS;EAAC,CAAE,EAAEM,OAAO,CAAC;AACjG;AAxBAC,OAAA,CAAAnB,gBAAA,GAAAA,gBAAA"}
+{"version":3,"sources":["../../lib/utils/useComboboxPopup.js"],"sourcesContent":["import { resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport { useMergedRefs } from '@fluentui/react-utilities';\nexport function useComboboxPopup(props, triggerShorthand, listboxShorthand) {\n  const {\n    positioning\n  } = props;\n  // popper options\n  const popperOptions = {\n    position: 'below',\n    align: 'start',\n    offset: {\n      crossAxis: 0,\n      mainAxis: 2\n    },\n    ...resolvePositioningShorthand(positioning)\n  };\n  const {\n    targetRef,\n    containerRef\n  } = 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    ...triggerShorthand,\n    ref: useMergedRefs(triggerShorthand === null || triggerShorthand === void 0 ? void 0 : triggerShorthand.ref, targetRef)\n  }, listbox];\n}\n//# sourceMappingURL=useComboboxPopup.js.map"],"names":["useComboboxPopup","props","triggerShorthand","listboxShorthand","positioning","popperOptions","position","align","offset","crossAxis","mainAxis","resolvePositioningShorthand","targetRef","containerRef","usePositioning","listboxRef","useMergedRefs","ref","listbox"],"mappings":";;;;+BAEgBA;;aAAAA;;kCAF4C;gCAC9B;AACvB,SAASA,iBAAiBC,KAAK,EAAEC,gBAAgB,EAAEC,gBAAgB,EAAE;IAC1E,MAAM,EACJC,YAAW,EACZ,GAAGH;IACJ,iBAAiB;IACjB,MAAMI,gBAAgB;QACpBC,UAAU;QACVC,OAAO;QACPC,QAAQ;YACNC,WAAW;YACXC,UAAU;QACZ;QACA,GAAGC,IAAAA,6CAA2B,EAACP,YAAY;IAC7C;IACA,MAAM,EACJQ,UAAS,EACTC,aAAY,EACb,GAAGC,IAAAA,gCAAc,EAACT;IACnB,MAAMU,aAAaC,IAAAA,6BAAa,EAACb,qBAAqB,IAAI,IAAIA,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBc,GAAG,EAAEJ;IAC3H,MAAMK,UAAUf,oBAAoB;QAClC,GAAGA,gBAAgB;QACnBc,KAAKF;IACP;IACA,OAAO;QAAC;YACN,GAAGb,gBAAgB;YACnBe,KAAKD,IAAAA,6BAAa,EAACd,qBAAqB,IAAI,IAAIA,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBe,GAAG,EAAEL;QAC/G;QAAGM;KAAQ;AACb,EACA,4CAA4C"}