@servicetitan/anvil2 1.49.3 → 1.49.5

package/dist/{Combobox-RjBDpgFV.js → match-sorter.esm-CtBw0MrM.js}

@@ -1,101 +1,6 @@
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import React__default, { forwardRef, useState, useEffect, createContext, useContext, useRef, useMemo, useCallback, useLayoutEffect, useReducer, cloneElement, Component, useId } from 'react';
-import { s as supportsPopover } from './DrawerContext-D4tWTLVf.js';
-import { P as Popover, u as usePopoverLegacyContext, f as usePopoverContext } from './Popover-CIPg_ZgX.js';
-import { c as cx, g as getDefaultExportFromCjs } from './index-tZvMCc77.js';
 import { a as _extends, _ as _objectWithoutPropertiesLoose } from './extends-Bg2s_OKl.js';
-import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-BlIWftBb.js';
-import { i as isMultiple, u as useDownshiftEnvironment$1, b as SELECT_ALL, a as defaultItemToKey$1, d as defaultItemToString$1, g as getScrollParent, A as ADD_NEW$1, S as SelectTriggerBase } from './SelectTriggerBase-C4gebtca.js';
-import { l as listboxStyles } from './Listbox.module-XuKszT3X.js';
-import { T as Text } from './Text-kPA-VzsB.js';
-import { D as Divider } from './Divider-Olv8yWXD.js';
-import { F as Flex } from './Flex-CjPHUTeq.js';
-import { S as Spinner } from './Spinner-xEFwsq8_.js';
-import { l as listViewStyles } from './ListView.module-BilDg12y.js';
-import { I as Icon$2 } from './Icon-BSuTVNaa.js';
-import { c as checkboxStyles, S as SvgIndeterminateCheckBox, a as SvgCheckBox, b as SvgCheckBoxOutlineBlank } from './indeterminate_check_box-RY9zr3xS.js';
-import { B as Button } from './Button-92_FKAyV.js';
-import { C as Chip } from './Chip-X2EwdZ97.js';
-import { S as SvgClose } from './close-DZj38AEh.js';
-import { S as SvgChevronRight } from './chevron_right-BdpsxX7x.js';
-import { S as SvgInfo } from './info-CYpG6tcI.js';
-import { S as SrOnly } from './SrOnly-CTsYSuby.js';
-import { T as Tooltip } from './Tooltip-CZsoFe6C.js';
-import { H as Helper } from './Helper-DjWotFtO.js';
-import { A as Avatar } from './Avatar-DeEV-v-b.js';
-import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
-import { useTrackingId } from './useTrackingId.js';
-import { S as SvgCheck } from './check-Cf67OWrZ.js';
-
-import './Combobox.css';const label = "_label_jfzvd_2";
-const required = "_required_jfzvd_46";
-const styles$2 = {
-	label: label,
-	"top-container": "_top-container_jfzvd_37",
-	"label-text": "_label-text_jfzvd_42",
-	required: required,
-	"info-trigger": "_info-trigger_jfzvd_51",
-	"info-content": "_info-content_jfzvd_56"
-};
-
-const LabelMoreInfoIcon = ({
-  moreInfo,
-  openMoreInfo
-}) => {
-  const [open, setOpen] = useState(openMoreInfo);
-  useEffect(() => {
-    if (openMoreInfo) {
-      setOpen(true);
-    } else {
-      setOpen(false);
-      setTimeout(() => {
-        setOpen(void 0);
-      });
-    }
-  }, [openMoreInfo]);
-  return /* @__PURE__ */ jsxs(
-    Tooltip,
-    {
-      open,
-      placement: "top",
-      offset: 5,
-      fallbackPlacements: ["right", "bottom", "left"],
-      children: [
-        /* @__PURE__ */ jsx(Tooltip.Trigger, { className: styles$2["info-trigger"], children: /* @__PURE__ */ jsx(Icon$2, { svg: SvgInfo }) }),
-        /* @__PURE__ */ jsx(Tooltip.Content, { className: styles$2["info-content"], children: moreInfo })
-      ]
-    }
-  );
-};
-const Label = forwardRef((props, ref) => {
-  const { children, className, moreInfo, required, openMoreInfo, ...rest } = props;
-  const LabelClassNames = cx([styles$2["label"]], className);
-  return /* @__PURE__ */ jsxs("label", { className: LabelClassNames, "data-anv": "label", ref, ...rest, children: [
-    /* @__PURE__ */ jsxs("div", { className: styles$2["top-container"], "aria-atomic": "true", children: [
-      /* @__PURE__ */ jsxs("span", { className: styles$2["label-text"], children: [
-        children,
-        required ? /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: styles$2["required"], children: "*" }),
-          /* @__PURE__ */ jsx(SrOnly, { children: "Required" })
-        ] }) : null
-      ] }),
-      moreInfo ? /* @__PURE__ */ jsx(LabelMoreInfoIcon, { moreInfo, openMoreInfo }) : null
-    ] }),
-    moreInfo ? /* @__PURE__ */ jsx(SrOnly, { children: moreInfo }) : null
-  ] });
-});
-Label.displayName = "Label";
-
-const ComboboxContext = createContext(null);
-const useCombobox$1 = function() {
-  const context = useContext(
-    ComboboxContext
-  );
-  if (context == null) {
-    throw new Error("useCombobox must be wrapped in <Combobox />");
-  }
-  return context;
-};
+import { g as getDefaultExportFromCjs } from './index-tZvMCc77.js';
+import React__default, { useRef, useEffect, useMemo, useCallback, useLayoutEffect, useReducer, cloneElement, Component } from 'react';
 
 function _setPrototypeOf(t, e) {
   return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) {
@@ -6354,4184 +6259,5 @@ function getKeyAttributes(key) {
   };
 }
 
-const ADD_NEW = Symbol.for("add-new");
-const defaultItemToString = function(item) {
-  return item != null ? String(item) : "";
-};
-const defaultItemToKey = function(item) {
-  return item;
-};
-const ComboboxLegacyContext = createContext(null);
-const useDownshiftEnvironment = () => {
-  const wrapperDivRef = useRef(null);
-  const shadowRoot = wrapperDivRef.current ? wrapperDivRef.current.getRootNode() : null;
-  const shadowDocument = wrapperDivRef.current && shadowRoot ? shadowRoot.ownerDocument : null;
-  const environment = shadowDocument ? {
-    document: shadowDocument,
-    addEventListener: shadowDocument.addEventListener.bind(shadowRoot),
-    removeEventListener: shadowDocument.removeEventListener.bind(shadowRoot),
-    Node
-  } : void 0;
-  return { ref: wrapperDivRef, environment };
-};
-const useComboboxLegacy = function() {
-  const context = useContext(
-    ComboboxLegacyContext
-  );
-  if (context == null) {
-    throw new Error("useComboboxLegacy must be wrapped in <ComboboxLegacy />");
-  }
-  return context;
-};
-
-const item$1 = "_item_rxmcz_5";
-const input = "_input_rxmcz_18";
-const prefix = "_prefix_rxmcz_46";
-const suffix = "_suffix_rxmcz_47";
-const combobox$1 = "_combobox_rxmcz_62";
-const select = "_select_rxmcz_71";
-const chip = "_chip_rxmcz_167";
-const listview$1 = "_listview_rxmcz_208";
-const empty$1 = "_empty_rxmcz_216";
-const Icon$1 = "_Icon_rxmcz_247";
-const small = "_small_rxmcz_252";
-const large = "_large_rxmcz_255";
-const error = "_error_rxmcz_273";
-const styles$1 = {
-	"buttons-wrapper": "_buttons-wrapper_rxmcz_3",
-	"search-field": "_search-field_rxmcz_4",
-	item: item$1,
-	input: input,
-	"input-wrapper": "_input-wrapper_rxmcz_19",
-	"toggle-button-wrapper": "_toggle-button-wrapper_rxmcz_32",
-	"close-button-wrapper": "_close-button-wrapper_rxmcz_33",
-	prefix: prefix,
-	suffix: suffix,
-	combobox: combobox$1,
-	select: select,
-	"popover-content": "_popover-content_rxmcz_74",
-	"no-clear-button": "_no-clear-button_rxmcz_93",
-	"input-flex": "_input-flex_rxmcz_96",
-	"fake-placeholder": "_fake-placeholder_rxmcz_124",
-	"close-button": "_close-button_rxmcz_33",
-	"toggle-button": "_toggle-button_rxmcz_32",
-	"rows-wrapper": "_rows-wrapper_rxmcz_157",
-	"chip-wrapper": "_chip-wrapper_rxmcz_167",
-	chip: chip,
-	listview: listview$1,
-	empty: empty$1,
-	Icon: Icon$1,
-	small: small,
-	large: large,
-	error: error,
-	"listview-option": "_listview-option_rxmcz_304"
-};
-
-const ComboboxLegacySingle = function(props) {
-  const { layoutStyles, componentProps } = useLayoutPropsUtil(props);
-  const {
-    className,
-    style,
-    children,
-    open,
-    disabled,
-    readOnly,
-    items: itemsProp,
-    itemToString: itemToStringProp,
-    itemToKey: itemToKeyProp,
-    onChange,
-    disableCloseOnClickOutside = false,
-    disableMatchReferenceWidth = false,
-    disableCloseOnSelectItem = false,
-    filterOptions,
-    loading = false,
-    root,
-    onInputValueChange,
-    environment: environmentProp,
-    ...rest
-  } = componentProps;
-  const ComboboxLegacyClassNames = cx(styles$1["combobox"], className);
-  const [items, setItems] = useState(itemsProp);
-  const [hasAddNew, setHasAddNew] = useState(false);
-  const [onSelectItemAddNew, setOnSelectItemAddNew] = useState(void 0);
-  const [hasExactMatch, setHasExactMatch] = useState(false);
-  const [hasDisabledPopover, setHasDisabledPopover] = useState(false);
-  const [hasEmpty, setHasEmpty] = useState(false);
-  const [disabledItems, setDisabledItems] = useState([]);
-  const [isReadOnly, setIsReadOnly] = useState(readOnly);
-  const [isDisabled, setIsDisabled] = useState(disabled);
-  const referenceRef = useRef(null);
-  const contentRef = useRef(null);
-  const handleOutsidePress = (e) => {
-    const clickedInsideReference = referenceRef.current && e.target != null && referenceRef.current.contains(e.target);
-    if (!clickedInsideReference) {
-      closeMenu();
-      return true;
-    } else {
-      return false;
-    }
-  };
-  const { ref: wrapperDivRef, environment } = useDownshiftEnvironment();
-  const showAddNew = hasAddNew && !hasExactMatch;
-  const combinedItems = useMemo(
-    () => showAddNew ? [...items, ADD_NEW] : items,
-    [items, showAddNew]
-  );
-  const itemToString = itemToStringProp ?? defaultItemToString;
-  const itemToKey = itemToKeyProp ?? defaultItemToKey;
-  const {
-    isOpen,
-    getLabelProps,
-    getInputProps,
-    getToggleButtonProps,
-    getMenuProps,
-    getItemProps,
-    highlightedIndex,
-    selectedItem,
-    selectItem,
-    setInputValue,
-    inputValue,
-    closeMenu
-  } = useCombobox({
-    ...rest,
-    items: combinedItems,
-    itemToString,
-    itemToKey,
-    isOpen: open,
-    initialIsOpen: open,
-    environment: environmentProp ?? environment,
-    // NOTE: Reducer needs to be pure, side-effects should be in event handlers
-    stateReducer(state, { type, changes }) {
-      switch (type) {
-        // keep ComboboxLegacy open onBlur, will call close using Popover's onOutsidePress
-        case useCombobox.stateChangeTypes.InputBlur:
-          return {
-            ...changes,
-            isOpen: open != null ? open : true,
-            highlightedIndex: state.highlightedIndex
-          };
-        case useCombobox.stateChangeTypes.InputKeyDownEnter:
-        case useCombobox.stateChangeTypes.ItemClick:
-          if (changes.selectedItem === ADD_NEW) {
-            const stateInputValue = state.inputValue;
-            setTimeout(() => {
-              onSelectItemAddNew?.(stateInputValue);
-            }, 0);
-            return {
-              ...changes,
-              selectedItem: state.selectedItem,
-              inputValue: ""
-            };
-          } else {
-            return {
-              ...changes,
-              isOpen: open != null ? open : disableCloseOnSelectItem ? true : changes.isOpen,
-              highlightedIndex: disableCloseOnSelectItem ? 0 : changes.highlightedIndex
-            };
-          }
-        // prevent this from closing the popover by default
-        case useCombobox.stateChangeTypes.InputClick:
-          return { ...changes, isOpen: open != null ? open : true };
-        default:
-          return changes;
-      }
-    },
-    onInputValueChange: onInputValueChange ?? (({ inputValue: inputValue2, type, selectedItem: selectedItem2 }) => {
-      const inputValueMatchesSelectedItem = selectedItem2 != null && inputValue2 === itemToString(selectedItem2);
-      const inputValueIsEmpty = inputValue2 == null || inputValue2 === "";
-      if (type === useCombobox.stateChangeTypes.InputKeyDownEnter || type === useCombobox.stateChangeTypes.ItemClick) {
-        setItems(itemsProp);
-        setHasExactMatch(true);
-      } else if (!inputValueMatchesSelectedItem && !inputValueIsEmpty) {
-        setItems(matchSorter(itemsProp, inputValue2, filterOptions));
-        setHasExactMatch(
-          matchSorter(itemsProp, inputValue2, {
-            ...filterOptions,
-            threshold: matchSorter.rankings.EQUAL
-          }).length > 0
-        );
-      } else {
-        setItems(itemsProp);
-        setHasExactMatch(true);
-      }
-    }),
-    onSelectedItemChange(changes) {
-      const { selectedItem: selectedItem2 } = changes;
-      if (onChange != null)
-        onChange(selectedItem2 != null ? selectedItem2 : null);
-    },
-    onIsOpenChange({ isOpen: isOpen2, inputValue: inputValue2, selectedItem: selectedItem2 }) {
-      if (isOpen2 === false) {
-        setItems(itemsProp);
-        if (inputValue2 === "") {
-          selectItem(null);
-        } else {
-          setInputValue(selectedItem2 != null ? itemToString(selectedItem2) : "");
-        }
-      }
-    },
-    isItemDisabled(item) {
-      if (isDisabled || isReadOnly) {
-        return !!isDisabled || !!isReadOnly;
-      }
-      if (item && item instanceof Object && "disabled" in item && item.disabled) {
-        return true;
-      }
-      if (item && item instanceof Object && "readOnly" in item && item.readOnly) {
-        return true;
-      }
-      if (disabledItems.includes(item)) {
-        return true;
-      }
-      return false;
-    }
-  });
-  const firstRenderRef = useRef(true);
-  useEffect(() => {
-    if (firstRenderRef.current === true) {
-      firstRenderRef.current = false;
-    }
-  }, []);
-  useEffect(() => {
-    setIsDisabled(disabled);
-  }, [disabled]);
-  useEffect(() => {
-    setIsReadOnly(readOnly);
-  }, [readOnly]);
-  useEffect(() => {
-    if (firstRenderRef.current) return;
-    const inputValueMatchesSelectedItem = selectedItem != null && inputValue === itemToString(selectedItem);
-    const inputValueIsEmpty = inputValue == null || inputValue === "";
-    if (!inputValueMatchesSelectedItem && !inputValueIsEmpty) {
-      setItems(matchSorter(itemsProp, inputValue, filterOptions));
-      setHasExactMatch(
-        matchSorter(itemsProp, inputValue, {
-          ...filterOptions,
-          threshold: matchSorter.rankings.EQUAL
-        }).length > 0
-      );
-    } else {
-      setItems(itemsProp);
-      setHasExactMatch(true);
-    }
-  }, [itemsProp]);
-  return /* @__PURE__ */ jsx(
-    ComboboxLegacyContext.Provider,
-    {
-      value: {
-        multiple: false,
-        select: false,
-        items,
-        itemToString,
-        itemToKey,
-        isOpen,
-        getLabelProps,
-        getInputProps,
-        getToggleButtonProps,
-        getMenuProps,
-        getItemProps,
-        highlightedIndex,
-        selectedItem,
-        selectedItems: [],
-        disabledItems,
-        setDisabledItems,
-        getSelectedItemProps: void 0,
-        getDropdownProps: void 0,
-        selectItem,
-        inputValue,
-        isDisabled,
-        isReadOnly,
-        setIsReadOnly,
-        setIsDisabled,
-        hasDisabledPopover,
-        setHasDisabledPopover,
-        hasEmpty,
-        setHasEmpty,
-        hasAddNew,
-        setHasAddNew,
-        onSelectItemAddNew,
-        setOnSelectItemAddNew,
-        hasExactMatch,
-        setHasExactMatch,
-        loading,
-        referenceRef,
-        contentRef,
-        closeMenu
-      },
-      children: /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: ComboboxLegacyClassNames,
-          "data-anv": "combobox",
-          style: { ...style, ...layoutStyles },
-          ref: wrapperDivRef,
-          children: /* @__PURE__ */ jsx(
-            Popover,
-            {
-              root,
-              open: isOpen,
-              noPadding: true,
-              disableCaret: true,
-              fitScreen: true,
-              disableFlipFallback: true,
-              placement: "bottom-start",
-              matchReferenceWidth: !disableMatchReferenceWidth,
-              disableCloseOnClickOutside,
-              onOutsidePress: handleOutsidePress,
-              children
-            }
-          )
-        }
-      )
-    }
-  );
-};
-const ComboboxLegacyMultiple = function(props) {
-  const { layoutStyles, componentProps } = useLayoutPropsUtil(props);
-  const {
-    className,
-    style,
-    children,
-    open,
-    items: itemsProp,
-    itemToString: itemToStringProp,
-    itemToKey: itemToKeyProp,
-    onChange,
-    onSelectedItemsChange,
-    disableCloseOnClickOutside = false,
-    disableMatchReferenceWidth = false,
-    disableCloseOnSelectItem = false,
-    disableClearInputValueOnSelectItem = false,
-    filterOptions,
-    loading = false,
-    root,
-    disabled,
-    readOnly,
-    stateReducer: _,
-    onInputValueChange,
-    initialSelectedItems,
-    initialActiveIndex,
-    defaultSelectedItems,
-    defaultActiveIndex,
-    activeIndex: activeIndexProp,
-    selectedItems: selectedItemsProp,
-    environment: environmentProp,
-    ...rest
-  } = componentProps;
-  const ComboboxLegacyClassNames = cx(styles$1["combobox"], className);
-  const [items, setItems] = useState(itemsProp);
-  const [hasAddNew, setHasAddNew] = useState(false);
-  const [onSelectItemAddNew, setOnSelectItemAddNew] = useState(void 0);
-  const [hasExactMatch, setHasExactMatch] = useState(false);
-  const [hasDisabledPopover, setHasDisabledPopover] = useState(false);
-  const [hasEmpty, setHasEmpty] = useState(false);
-  const [disabledItems, setDisabledItems] = useState([]);
-  const [isReadOnly, setIsReadOnly] = useState(readOnly);
-  const [isDisabled, setIsDisabled] = useState(disabled);
-  let storedSetInputValue = void 0;
-  const referenceRef = useRef(null);
-  const contentRef = useRef(null);
-  const handleOutsidePress = (e) => {
-    const clickedInsideReference = referenceRef.current && e.target != null && referenceRef.current.contains(e.target);
-    if (!clickedInsideReference) {
-      closeMenu();
-      return true;
-    } else {
-      return false;
-    }
-  };
-  const { ref: wrapperDivRef, environment } = useDownshiftEnvironment();
-  const showAddNew = hasAddNew && !hasExactMatch;
-  const combinedItems = useMemo(
-    () => showAddNew ? [...items, ADD_NEW] : items,
-    [items, showAddNew]
-  );
-  const itemToString = itemToStringProp ?? defaultItemToString;
-  const itemToKey = itemToKeyProp ?? defaultItemToKey;
-  const {
-    getSelectedItemProps,
-    getDropdownProps,
-    reset,
-    selectedItems,
-    addSelectedItem,
-    removeSelectedItem,
-    setSelectedItems
-  } = useMultipleSelection({
-    itemToKey,
-    initialSelectedItems,
-    initialActiveIndex,
-    defaultSelectedItems,
-    defaultActiveIndex,
-    activeIndex: activeIndexProp,
-    selectedItems: selectedItemsProp,
-    environment: environmentProp ?? environment,
-    stateReducer(state, { type, changes }) {
-      switch (type) {
-        // the Chip itself will handle "Backspace" and "Delete"
-        // just return previous state
-        case useMultipleSelection.stateChangeTypes.SelectedItemKeyDownBackspace:
-        case useMultipleSelection.stateChangeTypes.SelectedItemKeyDownDelete:
-          return state;
-        case useMultipleSelection.stateChangeTypes.FunctionRemoveSelectedItem:
-          return { ...changes, activeIndex: -1 };
-        case useMultipleSelection.stateChangeTypes.FunctionReset:
-          return { ...changes, selectedItems: [] };
-        default:
-          return changes;
-      }
-    },
-    onStateChange({ type }) {
-      switch (type) {
-        case useMultipleSelection.stateChangeTypes.FunctionReset:
-          storedSetInputValue?.("");
-          break;
-      }
-    },
-    onSelectedItemsChange(changes) {
-      const { selectedItems: selectedItems2 } = changes;
-      if (onChange != null) onChange(selectedItems2);
-      if (onSelectedItemsChange != null) onSelectedItemsChange(changes);
-    }
-  });
-  const {
-    isOpen,
-    getLabelProps,
-    getInputProps,
-    getToggleButtonProps,
-    getMenuProps,
-    getItemProps,
-    highlightedIndex,
-    selectedItem,
-    selectItem,
-    setInputValue,
-    inputValue,
-    closeMenu
-  } = useCombobox({
-    ...rest,
-    items: combinedItems,
-    itemToString,
-    itemToKey,
-    selectedItem: null,
-    isOpen: open,
-    initialIsOpen: open,
-    environment: environmentProp ?? environment,
-    // NOTE: Reducer needs to be pure, side-effects should be in event handlers
-    stateReducer(state, { type, changes }) {
-      switch (type) {
-        // keep ComboboxLegacy open onBlur, will call close using Popover's onOutsidePress
-        case useCombobox.stateChangeTypes.InputBlur:
-          return {
-            ...changes,
-            inputValue: state.inputValue,
-            selectedItem: null,
-            isOpen: open != null ? open : true,
-            highlightedIndex: state.highlightedIndex
-          };
-        case useCombobox.stateChangeTypes.InputKeyDownEnter:
-        case useCombobox.stateChangeTypes.ItemClick:
-          if (changes.selectedItem === ADD_NEW) {
-            const stateInputValue = state.inputValue;
-            setTimeout(() => {
-              onSelectItemAddNew?.(stateInputValue);
-            }, 0);
-            return {
-              ...changes,
-              selectedItem: state.selectedItem,
-              inputValue: ""
-            };
-          } else {
-            return {
-              ...changes,
-              isOpen: open != null ? open : disableCloseOnSelectItem ? true : changes.isOpen,
-              highlightedIndex: disableCloseOnSelectItem ? disableClearInputValueOnSelectItem || !state.inputValue ? state.highlightedIndex : 0 : changes.highlightedIndex,
-              inputValue: disableClearInputValueOnSelectItem ? state.inputValue : ""
-            };
-          }
-        // prevent this from closing the popover by default
-        case useCombobox.stateChangeTypes.InputClick:
-          return { ...changes, isOpen: open != null ? open : true };
-        // prevent this from clearing the input value by default
-        case useCombobox.stateChangeTypes.ControlledPropUpdatedSelectedItem:
-          return { ...changes, inputValue: state.inputValue };
-        default:
-          return changes;
-      }
-    },
-    onStateChange({ type, selectedItem: newSelectedItem }) {
-      switch (type) {
-        case useCombobox.stateChangeTypes.InputKeyDownEnter:
-        case useCombobox.stateChangeTypes.ItemClick:
-        case useCombobox.stateChangeTypes.InputBlur:
-          if (newSelectedItem != null) {
-            const itemAlreadySelected = selectedItems.some(
-              (item) => itemToKey(item) === itemToKey(newSelectedItem)
-            );
-            if (itemAlreadySelected) {
-              removeSelectedItem(newSelectedItem);
-            } else {
-              addSelectedItem(newSelectedItem);
-            }
-          }
-          break;
-      }
-    },
-    onInputValueChange: onInputValueChange ?? (({ inputValue: inputValue2, ...changes }) => {
-      const { type, selectedItem: selectedItem2 } = changes;
-      const inputValueMatchesSelectedItem = selectedItem2 != null && inputValue2 === itemToString(selectedItem2);
-      const inputValueIsEmpty = inputValue2 == null || inputValue2 === "";
-      if (type === useCombobox.stateChangeTypes.InputKeyDownEnter || type === useCombobox.stateChangeTypes.ItemClick) {
-        setItems(itemsProp);
-        setHasExactMatch(true);
-      } else if (!inputValueMatchesSelectedItem && !inputValueIsEmpty) {
-        setItems(matchSorter(itemsProp, inputValue2, filterOptions));
-        setHasExactMatch(
-          matchSorter(itemsProp, inputValue2, {
-            ...filterOptions,
-            threshold: matchSorter.rankings.EQUAL
-          }).length > 0
-        );
-      } else {
-        setItems(itemsProp);
-        setHasExactMatch(true);
-      }
-    }),
-    onIsOpenChange({ isOpen: isOpen2 }) {
-      if (isOpen2 === false) {
-        setInputValue("");
-        setItems(itemsProp);
-      }
-    },
-    isItemDisabled(item) {
-      if (isDisabled || isReadOnly) {
-        return !!isDisabled || !!isReadOnly;
-      }
-      if (item && item instanceof Object && "disabled" in item && item.disabled) {
-        return true;
-      }
-      if (item && item instanceof Object && "readOnly" in item && item.readOnly) {
-        return true;
-      }
-      if (disabledItems.includes(item)) {
-        return true;
-      }
-      return false;
-    }
-  });
-  storedSetInputValue = setInputValue;
-  const firstRenderRef = useRef(true);
-  useEffect(() => {
-    if (firstRenderRef.current === true) {
-      firstRenderRef.current = false;
-    }
-  }, []);
-  useEffect(() => {
-    setIsDisabled(disabled);
-  }, [disabled]);
-  useEffect(() => {
-    setIsReadOnly(readOnly);
-  }, [readOnly]);
-  useEffect(() => {
-    if (firstRenderRef.current) return;
-    const inputValueIsEmpty = inputValue == null || inputValue === "";
-    if (!inputValueIsEmpty) {
-      setItems(matchSorter(itemsProp, inputValue, filterOptions));
-      setHasExactMatch(
-        matchSorter(itemsProp, inputValue, {
-          ...filterOptions,
-          threshold: matchSorter.rankings.EQUAL
-        }).length > 0
-      );
-    } else {
-      setItems(itemsProp);
-      setHasExactMatch(true);
-    }
-  }, [itemsProp]);
-  return /* @__PURE__ */ jsx(
-    ComboboxLegacyContext.Provider,
-    {
-      value: {
-        multiple: true,
-        select: false,
-        items,
-        itemToString,
-        itemToKey,
-        isOpen,
-        getLabelProps,
-        getInputProps,
-        getToggleButtonProps,
-        getMenuProps,
-        getItemProps,
-        highlightedIndex,
-        selectedItem,
-        selectedItems,
-        disabledItems,
-        setDisabledItems,
-        getSelectedItemProps,
-        getDropdownProps,
-        reset,
-        addSelectedItem,
-        removeSelectedItem,
-        setSelectedItems,
-        selectItem,
-        inputValue,
-        isDisabled,
-        isReadOnly,
-        setIsReadOnly,
-        setIsDisabled,
-        hasDisabledPopover,
-        setHasDisabledPopover,
-        hasEmpty,
-        setHasEmpty,
-        hasAddNew,
-        setHasAddNew,
-        onSelectItemAddNew,
-        setOnSelectItemAddNew,
-        hasExactMatch,
-        setHasExactMatch,
-        loading,
-        referenceRef,
-        contentRef,
-        closeMenu
-      },
-      children: /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: ComboboxLegacyClassNames,
-          "data-anv": "combobox",
-          style: { ...style, ...layoutStyles },
-          ref: wrapperDivRef,
-          children: /* @__PURE__ */ jsx(
-            Popover,
-            {
-              root,
-              open: !isDisabled && isOpen,
-              noPadding: true,
-              disableCaret: true,
-              fitScreen: true,
-              disableFlipFallback: true,
-              placement: "bottom-start",
-              matchReferenceWidth: !disableMatchReferenceWidth,
-              disableCloseOnClickOutside,
-              onOutsidePress: handleOutsidePress,
-              children
-            }
-          )
-        }
-      )
-    }
-  );
-};
-const SelectLegacySingle = function(props) {
-  const { layoutStyles, componentProps } = useLayoutPropsUtil(props);
-  const {
-    className,
-    style,
-    children,
-    open,
-    disabled,
-    readOnly,
-    items,
-    itemToString: itemToStringProp,
-    itemToKey: itemToKeyProp,
-    onChange,
-    disableClearSelection = false,
-    disableCloseOnClickOutside = false,
-    disableMatchReferenceWidth = false,
-    disableCloseOnSelectItem = false,
-    loading = false,
-    root,
-    environment: environmentProp,
-    ...rest
-  } = componentProps;
-  const ComboboxLegacyClassNames = cx(styles$1["combobox"], className);
-  const [hasDisabledPopover, setHasDisabledPopover] = useState(false);
-  const [hasEmpty, setHasEmpty] = useState(false);
-  const [disabledItems, setDisabledItems] = useState([]);
-  const [isReadOnly, setIsReadOnly] = useState(readOnly);
-  const [isDisabled, setIsDisabled] = useState(disabled);
-  const referenceRef = useRef(null);
-  const contentRef = useRef(null);
-  const handleOutsidePress = (e) => {
-    const clickedInsideReference = referenceRef.current && e.target != null && referenceRef.current.contains(e.target);
-    if (!clickedInsideReference) {
-      closeMenu();
-      return true;
-    } else {
-      return false;
-    }
-  };
-  const { ref: wrapperDivRef, environment } = useDownshiftEnvironment();
-  const itemToString = itemToStringProp ?? defaultItemToString;
-  const itemToKey = itemToKeyProp ?? defaultItemToKey;
-  const {
-    isOpen,
-    getLabelProps,
-    getToggleButtonProps,
-    getMenuProps,
-    getItemProps,
-    highlightedIndex,
-    selectedItem,
-    selectItem,
-    inputValue,
-    closeMenu
-  } = useSelect({
-    ...rest,
-    items,
-    itemToString,
-    itemToKey,
-    isOpen: open,
-    initialIsOpen: open,
-    environment: environmentProp ?? environment,
-    // NOTE: Reducer needs to be pure, side-effects should be in event handlers
-    stateReducer(state, { type, changes }) {
-      switch (type) {
-        // keep ComboboxLegacy open onBlur, will call close using Popover's onOutsidePress
-        case useSelect.stateChangeTypes.ToggleButtonBlur:
-          return {
-            ...changes,
-            isOpen: open != null ? open : true,
-            highlightedIndex: state.highlightedIndex
-          };
-        case useSelect.stateChangeTypes.ToggleButtonKeyDownEnter:
-        case useSelect.stateChangeTypes.ItemClick:
-          return {
-            ...changes,
-            isOpen: open != null ? open : disableCloseOnSelectItem ? true : changes.isOpen,
-            highlightedIndex: disableCloseOnSelectItem ? 0 : changes.highlightedIndex
-          };
-        // prevent this from closing the popover by default
-        case useSelect.stateChangeTypes.ToggleButtonClick:
-          return { ...changes, isOpen: open != null ? open : true };
-        default:
-          return changes;
-      }
-    },
-    onSelectedItemChange(changes) {
-      const { selectedItem: selectedItem2 } = changes;
-      if (onChange != null)
-        onChange(selectedItem2 != null ? selectedItem2 : null);
-    },
-    isItemDisabled(item) {
-      if (isDisabled || isReadOnly) {
-        return !!isDisabled || !!isReadOnly;
-      }
-      if (item && item instanceof Object && "disabled" in item && item.disabled) {
-        return true;
-      }
-      if (item && item instanceof Object && "readOnly" in item && item.readOnly) {
-        return true;
-      }
-      if (disabledItems.includes(item)) {
-        return true;
-      }
-      return false;
-    }
-  });
-  useEffect(() => {
-    setIsDisabled(disabled);
-  }, [disabled]);
-  useEffect(() => {
-    setIsReadOnly(readOnly);
-  }, [readOnly]);
-  return /* @__PURE__ */ jsx(
-    ComboboxLegacyContext.Provider,
-    {
-      value: {
-        multiple: false,
-        select: true,
-        disableClearSelection,
-        items,
-        itemToString,
-        itemToKey,
-        isOpen,
-        getLabelProps,
-        getToggleButtonProps,
-        getMenuProps,
-        getItemProps,
-        highlightedIndex,
-        selectedItem,
-        selectedItems: [],
-        disabledItems,
-        setDisabledItems,
-        selectItem,
-        inputValue,
-        isDisabled,
-        isReadOnly,
-        setIsReadOnly,
-        setIsDisabled,
-        hasDisabledPopover,
-        setHasDisabledPopover,
-        hasEmpty,
-        setHasEmpty,
-        loading,
-        referenceRef,
-        contentRef,
-        closeMenu
-      },
-      children: /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: ComboboxLegacyClassNames,
-          "data-anv": "combobox",
-          style: { ...style, ...layoutStyles },
-          ref: wrapperDivRef,
-          children: /* @__PURE__ */ jsx(
-            Popover,
-            {
-              root,
-              open: isOpen,
-              noPadding: true,
-              disableCaret: true,
-              fitScreen: true,
-              disableFlipFallback: true,
-              placement: "bottom-start",
-              matchReferenceWidth: !disableMatchReferenceWidth,
-              disableCloseOnClickOutside,
-              onOutsidePress: handleOutsidePress,
-              children
-            }
-          )
-        }
-      )
-    }
-  );
-};
-const SelectLegacyMultiple = function(props) {
-  const { layoutStyles, componentProps } = useLayoutPropsUtil(props);
-  const {
-    className,
-    style,
-    children,
-    open,
-    items,
-    itemToString: itemToStringProp,
-    itemToKey: itemToKeyProp,
-    onChange,
-    onSelectedItemsChange,
-    disableCloseOnClickOutside = false,
-    disableMatchReferenceWidth = false,
-    disableCloseOnSelectItem = false,
-    loading = false,
-    root,
-    disabled,
-    readOnly,
-    stateReducer: _,
-    initialSelectedItems,
-    initialActiveIndex,
-    defaultSelectedItems,
-    defaultActiveIndex,
-    activeIndex: activeIndexProp,
-    selectedItems: selectedItemsProp,
-    environment: environmentProp,
-    ...rest
-  } = componentProps;
-  const ComboboxLegacyClassNames = cx(styles$1["combobox"], className);
-  const [hasDisabledPopover, setHasDisabledPopover] = useState(false);
-  const [hasEmpty, setHasEmpty] = useState(false);
-  const [disabledItems, setDisabledItems] = useState([]);
-  const [isReadOnly, setIsReadOnly] = useState(readOnly);
-  const [isDisabled, setIsDisabled] = useState(disabled);
-  const referenceRef = useRef(null);
-  const contentRef = useRef(null);
-  const handleOutsidePress = (e) => {
-    const clickedInsideReference = referenceRef.current && e.target != null && referenceRef.current.contains(e.target);
-    if (!clickedInsideReference) {
-      closeMenu();
-      return true;
-    } else {
-      return false;
-    }
-  };
-  const { ref: wrapperDivRef, environment } = useDownshiftEnvironment();
-  const itemToString = itemToStringProp ?? defaultItemToString;
-  const itemToKey = itemToKeyProp ?? defaultItemToKey;
-  const {
-    getSelectedItemProps,
-    getDropdownProps,
-    reset,
-    selectedItems,
-    addSelectedItem,
-    removeSelectedItem,
-    setSelectedItems
-  } = useMultipleSelection({
-    itemToKey,
-    initialSelectedItems,
-    initialActiveIndex,
-    defaultSelectedItems,
-    defaultActiveIndex,
-    activeIndex: activeIndexProp,
-    selectedItems: selectedItemsProp,
-    environment: environmentProp ?? environment,
-    stateReducer(state, { type, changes }) {
-      switch (type) {
-        // the Chip itself will handle "Backspace" and "Delete"
-        // just return previous state
-        case useMultipleSelection.stateChangeTypes.SelectedItemKeyDownBackspace:
-        case useMultipleSelection.stateChangeTypes.SelectedItemKeyDownDelete:
-          return state;
-        case useMultipleSelection.stateChangeTypes.FunctionRemoveSelectedItem:
-          return { ...changes, activeIndex: -1 };
-        case useMultipleSelection.stateChangeTypes.FunctionReset:
-          return { ...changes, selectedItems: [] };
-        default:
-          return changes;
-      }
-    },
-    onSelectedItemsChange(changes) {
-      const { selectedItems: selectedItems2 } = changes;
-      if (onChange != null) onChange(selectedItems2);
-      if (onSelectedItemsChange != null) onSelectedItemsChange(changes);
-    }
-  });
-  const {
-    isOpen,
-    getLabelProps,
-    getToggleButtonProps,
-    getMenuProps,
-    getItemProps,
-    highlightedIndex,
-    selectedItem,
-    selectItem,
-    inputValue,
-    closeMenu
-  } = useSelect({
-    ...rest,
-    items,
-    itemToString,
-    itemToKey,
-    selectedItem: null,
-    isOpen: open,
-    initialIsOpen: open,
-    environment: environmentProp ?? environment,
-    // NOTE: Reducer needs to be pure, side-effects should be in event handlers
-    stateReducer(state, { type, changes }) {
-      switch (type) {
-        // keep ComboboxLegacy open onBlur, will call close using Popover's onOutsidePress
-        case useSelect.stateChangeTypes.ToggleButtonBlur:
-          return {
-            ...changes,
-            selectedItem: null,
-            isOpen: open != null ? open : true,
-            highlightedIndex: state.highlightedIndex
-          };
-        case useSelect.stateChangeTypes.ToggleButtonKeyDownEnter:
-        case useSelect.stateChangeTypes.ItemClick:
-          return {
-            ...changes,
-            isOpen: open != null ? open : disableCloseOnSelectItem ? true : changes.isOpen,
-            highlightedIndex: disableCloseOnSelectItem ? 0 : changes.highlightedIndex
-          };
-        // prevent this from closing the popover by default
-        case useSelect.stateChangeTypes.ToggleButtonClick:
-          return { ...changes, isOpen: open != null ? open : true };
-        default:
-          return changes;
-      }
-    },
-    onStateChange({ type, selectedItem: newSelectedItem }) {
-      switch (type) {
-        case useSelect.stateChangeTypes.ToggleButtonKeyDownEnter:
-        case useSelect.stateChangeTypes.ItemClick:
-        case useSelect.stateChangeTypes.ToggleButtonBlur:
-          if (newSelectedItem != null) {
-            const itemAlreadySelected = selectedItems.some(
-              (item) => itemToKey(item) === itemToKey(newSelectedItem)
-            );
-            if (itemAlreadySelected) {
-              removeSelectedItem(newSelectedItem);
-            } else {
-              addSelectedItem(newSelectedItem);
-            }
-          }
-          break;
-      }
-    },
-    isItemDisabled(item) {
-      if (isDisabled || isReadOnly) {
-        return !!isDisabled || !!isReadOnly;
-      }
-      if (item && item instanceof Object && "disabled" in item && item.disabled) {
-        return true;
-      }
-      if (item && item instanceof Object && "readOnly" in item && item.readOnly) {
-        return true;
-      }
-      if (disabledItems.includes(item)) {
-        return true;
-      }
-      return false;
-    }
-  });
-  useEffect(() => {
-    setIsDisabled(disabled);
-  }, [disabled]);
-  useEffect(() => {
-    setIsReadOnly(readOnly);
-  }, [readOnly]);
-  return /* @__PURE__ */ jsx(
-    ComboboxLegacyContext.Provider,
-    {
-      value: {
-        multiple: true,
-        select: true,
-        items,
-        itemToString,
-        itemToKey,
-        isOpen,
-        getLabelProps,
-        getToggleButtonProps,
-        getMenuProps,
-        getItemProps,
-        highlightedIndex,
-        selectedItem,
-        selectedItems,
-        disabledItems,
-        setDisabledItems,
-        getSelectedItemProps,
-        getDropdownProps,
-        reset,
-        addSelectedItem,
-        removeSelectedItem,
-        setSelectedItems,
-        selectItem,
-        inputValue,
-        isDisabled,
-        isReadOnly,
-        setIsReadOnly,
-        setIsDisabled,
-        hasDisabledPopover,
-        setHasDisabledPopover,
-        hasEmpty,
-        setHasEmpty,
-        loading,
-        referenceRef,
-        contentRef,
-        closeMenu
-      },
-      children: /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: ComboboxLegacyClassNames,
-          "data-anv": "combobox",
-          style: { ...style, ...layoutStyles },
-          ref: wrapperDivRef,
-          children: /* @__PURE__ */ jsx(
-            Popover,
-            {
-              root,
-              open: !isDisabled && isOpen,
-              noPadding: true,
-              disableCaret: true,
-              fitScreen: true,
-              disableFlipFallback: true,
-              placement: "bottom-start",
-              matchReferenceWidth: !disableMatchReferenceWidth,
-              disableCloseOnClickOutside,
-              onOutsidePress: handleOutsidePress,
-              children
-            }
-          )
-        }
-      )
-    }
-  );
-};
-
-const ComboboxLegacyTrigger = ({
-  // variant: variantProp = "combobox",
-  className,
-  label,
-  size,
-  error,
-  hint,
-  description,
-  required,
-  moreInfo,
-  openMoreInfo,
-  prefix,
-  suffix,
-  maxRows,
-  id,
-  disabled,
-  readOnly,
-  ...rest
-}) => {
-  const {
-    select,
-    disableClearSelection,
-    itemToString,
-    getLabelProps,
-    getInputProps,
-    getToggleButtonProps,
-    selectedItem,
-    selectedItems,
-    getSelectedItemProps,
-    getDropdownProps,
-    reset,
-    removeSelectedItem,
-    selectItem,
-    inputValue,
-    isDisabled,
-    isReadOnly,
-    referenceRef,
-    contentRef,
-    closeMenu,
-    setIsDisabled,
-    setIsReadOnly
-  } = useComboboxLegacy();
-  const variant = select ? "select" : "combobox";
-  const context = usePopoverLegacyContext();
-  const inputRef = useRef(null);
-  const ComboboxLegacyTriggerClassNames = cx(styles$1["search-field"], {
-    [styles$1["select"]]: variant === "select"
-  });
-  const noClearButton = isDisabled || isReadOnly || disableClearSelection;
-  const ComboboxLegacyInputWrapperClassNames = cx(
-    styles$1["input-wrapper"],
-    className ? {
-      [className]: variant === "select"
-    } : {},
-    {
-      [styles$1["small"]]: size === "small",
-      [styles$1["large"]]: size === "large",
-      [styles$1["no-clear-button"]]: noClearButton
-    }
-  );
-  const ComboboxLegacyInputClassNames = cx(
-    styles$1["input"],
-    className ? {
-      [className]: variant === "combobox"
-    } : {},
-    {
-      [styles$1["error"]]: error
-    }
-  );
-  useLayoutEffect(() => {
-    if (typeof disabled === "undefined") return;
-    setIsDisabled(disabled);
-  }, [disabled, setIsDisabled]);
-  useLayoutEffect(() => {
-    if (typeof readOnly === "undefined") return;
-    setIsReadOnly(readOnly);
-  }, [readOnly, setIsReadOnly]);
-  const labelUid = "label" + useId();
-  const helperUid = "helper" + useId();
-  const placeholderUid = "placeholder" + useId();
-  const ariaDescribedBy = `${helperUid} ${placeholderUid}`;
-  const errorMessage = typeof error !== "boolean" ? error : void 0;
-  const handleBlur = (e) => {
-    const target = e.relatedTarget ?? e.target;
-    const focusedOnReference = referenceRef.current && referenceRef.current.contains(target);
-    const focusedOnContent = contentRef.current && contentRef.current.contains(target);
-    if (!focusedOnReference && !focusedOnContent) {
-      closeMenu();
-    }
-  };
-  const rowsRef = useRef(null);
-  const [stillCalculating, setStillCalculating] = useState(false);
-  const [collapsedChips, setCollapsedChips] = useState(false);
-  const [visibleChipsCount, setVisibleChipsCount] = useState(
-    null
-  );
-  const [forceRenderCount, setForceRenderCount] = useState(0);
-  useLayoutEffect(() => {
-    if (maxRows === void 0) return;
-    if (stillCalculating === false) {
-      setStillCalculating(true);
-      setCollapsedChips(false);
-      setVisibleChipsCount(null);
-      setForceRenderCount((x) => x + 1);
-    } else if (rowsRef?.current?.children) {
-      const children = rowsRef?.current?.children;
-      const rowData = Array.from(children).reduce(
-        (acc, child) => {
-          const top = child.getBoundingClientRect().top;
-          if (!acc.length) {
-            return [{ count: 1, top }];
-          } else if (acc[acc.length - 1].top === top) {
-            return [
-              ...acc.slice(0, -1),
-              { count: acc[acc.length - 1].count + 1, top }
-            ];
-          } else if (acc[acc.length - 1].top !== top) {
-            return [...acc, { count: 1, top }];
-          } else {
-            return acc;
-          }
-        },
-        []
-      );
-      if (!rowData[maxRows] || visibleChipsCount === 0) {
-        setStillCalculating(false);
-      } else {
-        setCollapsedChips(true);
-        if (visibleChipsCount == null) {
-          const firstGuess = Math.max(
-            rowData.reduce((sum, row) => sum + row.count, -2),
-            0
-          );
-          setVisibleChipsCount(firstGuess);
-        } else {
-          setVisibleChipsCount(visibleChipsCount - 1);
-        }
-        setForceRenderCount((x) => x + 1);
-      }
-    }
-  }, [selectedItems.length, maxRows, forceRenderCount]);
-  const selectedItemsDisplayCount = collapsedChips && maxRows != null && visibleChipsCount !== null ? visibleChipsCount : selectedItems.length;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: ComboboxLegacyTriggerClassNames,
-      "data-anv": "combobox-searchfield",
-      ref: referenceRef,
-      onBlur: handleBlur,
-      children: [
-        label ? /* @__PURE__ */ jsx(
-          Label,
-          {
-            ...getLabelProps({
-              className: styles$1["label"],
-              required,
-              moreInfo,
-              openMoreInfo,
-              id: labelUid
-            }),
-            children: label
-          }
-        ) : null,
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: ComboboxLegacyInputWrapperClassNames,
-            role: "presentation",
-            ...variant === "select" ? {
-              ...getToggleButtonProps({
-                disabled: isDisabled,
-                readOnly: isReadOnly,
-                ref: context.refs.setReference,
-                id,
-                "aria-describedby": ariaDescribedBy,
-                "aria-labelledby": labelUid
-              })
-            } : {
-              ref: context.refs.setReference,
-              onClick: () => inputRef.current?.focus()
-            },
-            children: [
-              /* @__PURE__ */ jsxs("div", { className: styles$1["buttons-wrapper"], children: [
-                (inputValue || selectedItem || selectedItems.length) && !noClearButton ? /* @__PURE__ */ jsx("div", { className: styles$1["close-button-wrapper"], children: /* @__PURE__ */ jsx(
-                  Button,
-                  {
-                    "aria-label": "clear selection",
-                    appearance: "ghost",
-                    size: "small",
-                    icon: SvgClose,
-                    className: styles$1["close-button"],
-                    onClick: (e) => {
-                      e.stopPropagation();
-                      if (reset != null) {
-                        reset();
-                      } else {
-                        selectItem(null);
-                      }
-                    },
-                    tabIndex: -1
-                  }
-                ) }) : null,
-                /* @__PURE__ */ jsx("div", { className: styles$1["toggle-button-wrapper"], children: /* @__PURE__ */ jsx(
-                  Button,
-                  {
-                    ...variant === "select" ? { tabIndex: -1 } : getToggleButtonProps(),
-                    className: styles$1["toggle-button"],
-                    "aria-label": "toggle menu",
-                    icon: SvgChevronRight,
-                    appearance: "ghost",
-                    size: "small",
-                    disabled: isDisabled
-                  }
-                ) })
-              ] }),
-              /* @__PURE__ */ jsxs("div", { className: styles$1["rows-wrapper"], ref: rowsRef, children: [
-                selectedItems.length && removeSelectedItem != null && getSelectedItemProps != null ? selectedItems.slice(0, selectedItemsDisplayCount).map((item, index) => {
-                  const { onClick, ...selectedItemProps } = getSelectedItemProps({
-                    selectedItem: item,
-                    index
-                  });
-                  return /* @__PURE__ */ jsx(
-                    "div",
-                    {
-                      className: styles$1["chip-wrapper"],
-                      children: /* @__PURE__ */ jsx(
-                        Chip,
-                        {
-                          ...selectedItemProps,
-                          label: itemToString(item),
-                          onClose: isDisabled || isReadOnly ? void 0 : (_e) => {
-                            removeSelectedItem(item);
-                          },
-                          className: styles$1["chip"],
-                          title: itemToString(item)
-                        }
-                      )
-                    },
-                    `selected-item-${index}`
-                  );
-                }) : null,
-                collapsedChips && maxRows != null ? /* @__PURE__ */ jsx("div", { className: styles$1["chip-wrapper"], children: /* @__PURE__ */ jsx(
-                  Chip,
-                  {
-                    label: `+${selectedItems.length - selectedItemsDisplayCount}`,
-                    className: styles$1["chip"],
-                    title: selectedItems.slice(selectedItemsDisplayCount).map((item) => itemToString(item)).join(", ")
-                  }
-                ) }) : null,
-                /* @__PURE__ */ jsxs(Flex, { className: styles$1["input-flex"], alignItems: "center", children: [
-                  prefix ? /* @__PURE__ */ jsx("div", { className: styles$1["prefix"], children: prefix }) : null,
-                  variant === "select" ? /* @__PURE__ */ jsx(
-                    "div",
-                    {
-                      ...getDropdownProps != null ? getDropdownProps({
-                        className: ComboboxLegacyInputClassNames,
-                        required,
-                        preventKeyAction: false
-                      }) : {
-                        className: ComboboxLegacyInputClassNames,
-                        required
-                      },
-                      children: selectedItems.length ? null : selectedItem ? itemToString(selectedItem) : /* @__PURE__ */ jsx(
-                        "span",
-                        {
-                          className: styles$1["fake-placeholder"],
-                          id: placeholderUid,
-                          children: rest.placeholder
-                        }
-                      )
-                    }
-                  ) : /* @__PURE__ */ jsx(
-                    "input",
-                    {
-                      ...getDropdownProps != null && getInputProps != null ? getInputProps(
-                        getDropdownProps({
-                          ...rest,
-                          className: ComboboxLegacyInputClassNames,
-                          disabled: isDisabled,
-                          readOnly: isReadOnly,
-                          required,
-                          autoComplete: "off",
-                          id,
-                          "aria-describedby": ariaDescribedBy,
-                          "aria-labelledby": labelUid,
-                          preventKeyAction: false,
-                          ref: inputRef
-                        })
-                      ) : getInputProps != null ? getInputProps({
-                        ...rest,
-                        className: ComboboxLegacyInputClassNames,
-                        disabled: isDisabled,
-                        readOnly: isReadOnly,
-                        required,
-                        autoComplete: "off",
-                        id,
-                        "aria-describedby": ariaDescribedBy,
-                        "aria-labelledby": labelUid,
-                        ref: inputRef
-                      }) : {}
-                    }
-                  ),
-                  suffix ? /* @__PURE__ */ jsx("div", { className: styles$1["suffix"], children: suffix }) : null
-                ] })
-              ] })
-            ]
-          }
-        ),
-        hint || errorMessage || description ? /* @__PURE__ */ jsx(
-          Helper,
-          {
-            id: helperUid,
-            errorMessage,
-            hint,
-            description
-          }
-        ) : null
-      ]
-    }
-  );
-};
-
-const ComboboxLegacyContent = function({
-  children,
-  className,
-  disablePopover = false,
-  ...rest
-}) {
-  const {
-    items,
-    itemToKey,
-    inputValue,
-    selectedItem,
-    selectedItems,
-    setHasDisabledPopover,
-    getMenuProps,
-    getItemProps,
-    isDisabled,
-    isReadOnly,
-    referenceRef,
-    contentRef,
-    closeMenu
-  } = useComboboxLegacy();
-  const ComboboxLegacyPopoverContentClassNames = cx(
-    styles$1["popover-content"],
-    className
-  );
-  useEffect(() => {
-    setHasDisabledPopover(disablePopover);
-    return () => {
-      setHasDisabledPopover(false);
-    };
-  }, [disablePopover, setHasDisabledPopover]);
-  const handleBlur = (e) => {
-    const target = e.relatedTarget ?? e.target;
-    const focusedOnReference = referenceRef.current && referenceRef.current.contains(target);
-    const focusedOnContent = contentRef.current && contentRef.current.contains(target);
-    if (!focusedOnReference && !focusedOnContent) {
-      closeMenu();
-    }
-  };
-  return disablePopover ? /* @__PURE__ */ jsx(
-    "div",
-    {
-      ...rest,
-      className: ComboboxLegacyPopoverContentClassNames,
-      ref: contentRef,
-      onBlur: handleBlur,
-      children: children ? children({
-        items,
-        inputValue,
-        selectedItem,
-        getMenuProps,
-        getItemProps,
-        listProps: {
-          ...getMenuProps({}, { suppressRefError: true }),
-          style: {
-            display: items.length ? "" : "none",
-            overflow: "auto"
-          }
-        },
-        options: items.map((item, index) => ({
-          optionProps: {
-            ...getItemProps({
-              item,
-              index
-            }),
-            selected: itemToKey(selectedItem) === itemToKey(item) || selectedItems.some(
-              (selectedItem2) => itemToKey(selectedItem2) === itemToKey(item)
-            ),
-            disabled: !!isDisabled || !!isReadOnly
-            // also see "isItemDisabled" function
-          },
-          item,
-          index
-        }))
-      }) : null
-    }
-  ) : /* @__PURE__ */ jsx(
-    Popover.Content,
-    {
-      "data-anv": "combobox-content",
-      ...rest,
-      className: ComboboxLegacyPopoverContentClassNames,
-      ref: getMenuProps({ ref: contentRef }, { suppressRefError: true }).ref,
-      onBlur: handleBlur,
-      children: children ? children({
-        items,
-        inputValue,
-        selectedItem,
-        getMenuProps,
-        getItemProps,
-        listProps: {
-          ...getMenuProps({}, { suppressRefError: true }),
-          style: {
-            display: items.length ? void 0 : "none",
-            overflow: "auto"
-          }
-        },
-        options: items.map((item, index) => ({
-          optionProps: {
-            ...getItemProps({
-              item,
-              index
-            }),
-            selected: itemToKey(selectedItem) === itemToKey(item) || selectedItems.some(
-              (selectedItem2) => itemToKey(selectedItem2) === itemToKey(item)
-            ),
-            disabled: !!isDisabled || !!isReadOnly
-            // also see "isItemDisabled" function
-          },
-          item,
-          index
-        }))
-      }) : null
-    }
-  );
-};
-
-const ComboboxLegacyList = function({
-  children,
-  ...rest
-}) {
-  const {
-    getMenuProps,
-    multiple,
-    items,
-    hasAddNew = false,
-    hasEmpty,
-    loading
-  } = useComboboxLegacy();
-  if (multiple) {
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsxs(
-        "div",
-        {
-          ...getMenuProps(rest),
-          "data-anv": "combobox-list",
-          className: cx(styles$1["listview"], listViewStyles["listview"]),
-          style: {
-            display: items.length || hasAddNew ? void 0 : "none",
-            overflow: "auto"
-          },
-          children: [
-            children,
-            loading ? /* @__PURE__ */ jsx(Flex, { justifyContent: "center", children: /* @__PURE__ */ jsx(Spinner, { size: "small" }) }) : null
-          ]
-        }
-      ),
-      !items.length && !hasEmpty ? /* @__PURE__ */ jsx("div", { className: styles$1["empty"], children: /* @__PURE__ */ jsx(Text, { subdued: true, size: "small", children: "No match found" }) }) : null
-    ] });
-  } else {
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsxs(
-        "ul",
-        {
-          ...getMenuProps(rest),
-          "data-anv": "combobox-list",
-          className: listboxStyles["listbox"],
-          style: {
-            display: items.length || hasAddNew ? void 0 : "none",
-            overflow: "auto"
-          },
-          children: [
-            children,
-            loading ? /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Flex, { justifyContent: "center", children: /* @__PURE__ */ jsx(Spinner, { size: "small" }) }) }) : null
-          ]
-        }
-      ),
-      !items.length && !hasEmpty ? /* @__PURE__ */ jsx("div", { className: styles$1["empty"], children: /* @__PURE__ */ jsx(Text, { subdued: true, size: "small", children: "No match found" }) }) : null
-    ] });
-  }
-};
-
-const ComboboxLegacyItem = function({
-  children,
-  disabled: disabledProp,
-  item,
-  index,
-  alignItems,
-  justifyItems,
-  alignContent,
-  justifyContent,
-  placeItems,
-  placeContent,
-  gap,
-  rowGap,
-  columnGap,
-  ...rest
-}) {
-  const {
-    itemToKey,
-    getItemProps,
-    multiple,
-    selectedItem,
-    selectedItems,
-    disabledItems,
-    setDisabledItems,
-    highlightedIndex
-  } = useComboboxLegacy();
-  const disabled = disabledProp || item && item instanceof Object && "disabled" in item && item.disabled;
-  useEffect(() => {
-    if (disabledProp && !disabledItems.includes(item)) {
-      setDisabledItems([...disabledItems, item]);
-    } else if (disabledItems.includes(item)) {
-      setDisabledItems(disabledItems.filter((prevItem) => prevItem === item));
-    }
-    return () => {
-      if (disabledItems.includes(item)) {
-        setDisabledItems(disabledItems.filter((prevItem) => prevItem === item));
-      }
-    };
-  }, [item, disabledProp, setDisabledItems]);
-  if (multiple) {
-    const checked = selectedItems.some(
-      (selectedItem2) => itemToKey(selectedItem2) === itemToKey(item)
-    );
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        "data-anv": "combobox-item",
-        ...getItemProps({
-          item,
-          index,
-          "aria-selected": highlightedIndex === index,
-          ...rest
-        }),
-        className: cx(
-          styles$1["listview-option"],
-          listViewStyles["listview-option"]
-        ),
-        children: [
-          /* @__PURE__ */ jsx("div", { className: cx(styles$1["cell"], listViewStyles["cell"]), children: /* @__PURE__ */ jsx("div", { className: checkboxStyles["wrapper"], children: /* @__PURE__ */ jsxs("div", { className: checkboxStyles["checkbox"], children: [
-            /* @__PURE__ */ jsx(
-              "input",
-              {
-                type: "checkbox",
-                checked,
-                "aria-checked": checked,
-                "aria-label": "Select",
-                readOnly: true,
-                ...disabled ? { disabled: true } : {}
-              }
-            ),
-            /* @__PURE__ */ jsxs("span", { className: checkboxStyles["icon-wrapper"], "aria-hidden": true, children: [
-              /* @__PURE__ */ jsx(
-                Icon$2,
-                {
-                  size: "large",
-                  svg: SvgIndeterminateCheckBox,
-                  className: checkboxStyles["icon-indeterminate"]
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                Icon$2,
-                {
-                  size: "large",
-                  svg: SvgCheckBox,
-                  className: checkboxStyles["icon-checked"]
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                Icon$2,
-                {
-                  size: "large",
-                  svg: SvgCheckBoxOutlineBlank,
-                  className: checkboxStyles["icon-unchecked"]
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsx("span", { "aria-hidden": true })
-          ] }) }) }),
-          /* @__PURE__ */ jsx(
-            Flex,
-            {
-              grow: 1,
-              shrink: 1,
-              alignItems,
-              justifyItems,
-              alignContent,
-              justifyContent,
-              placeItems,
-              placeContent,
-              gap,
-              rowGap,
-              columnGap,
-              children
-            }
-          )
-        ]
-      }
-    );
-  } else {
-    return /* @__PURE__ */ jsxs(
-      "li",
-      {
-        ...getItemProps({
-          item,
-          index,
-          "aria-selected": highlightedIndex === index,
-          ...rest
-        }),
-        "data-anv": "combobox-item",
-        "data-checked": itemToKey(selectedItem) === itemToKey(item),
-        className: styles$1["item"],
-        ...disabled ? { "aria-disabled": true } : {},
-        children: [
-          /* @__PURE__ */ jsx(
-            Flex,
-            {
-              className: listboxStyles["children"],
-              grow: 1,
-              shrink: 1,
-              alignItems,
-              justifyItems,
-              alignContent,
-              justifyContent,
-              placeItems,
-              placeContent,
-              gap,
-              rowGap,
-              columnGap,
-              children
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            Icon$2,
-            {
-              "aria-hidden": true,
-              svg: SvgCheck,
-              inherit: true,
-              className: styles$1["Icon"],
-              style: {
-                opacity: itemToKey(selectedItem) === itemToKey(item) ? 1 : 0
-              }
-            }
-          )
-        ]
-      }
-    );
-  }
-};
-const ComboboxLegacyItemAddNew = function({
-  onSelection,
-  ...props
-}) {
-  const { items, setHasAddNew, hasExactMatch, setOnSelectItemAddNew } = useComboboxLegacy();
-  useEffect(() => {
-    setHasAddNew?.(true);
-    return () => {
-      setHasAddNew?.(false);
-    };
-  }, []);
-  useEffect(() => {
-    setOnSelectItemAddNew?.(() => onSelection);
-    return () => {
-      setOnSelectItemAddNew?.(void 0);
-    };
-  }, [setOnSelectItemAddNew, onSelection]);
-  const firstRenderRef = useRef(true);
-  useEffect(() => {
-    if (firstRenderRef.current === true) {
-      firstRenderRef.current = false;
-    }
-  }, []);
-  return !hasExactMatch && !firstRenderRef.current ? /* @__PURE__ */ jsx(
-    ComboboxLegacyItem,
-    {
-      ...props,
-      item: ADD_NEW,
-      index: items.length
-    }
-  ) : null;
-};
-
-const ComboboxLegacyEmpty = function({
-  children
-}) {
-  const { items, setHasEmpty } = useComboboxLegacy();
-  useEffect(() => {
-    setHasEmpty?.(true);
-    return () => {
-      setHasEmpty?.(false);
-    };
-  });
-  return !items.length ? children : null;
-};
-
-const ComboboxEmptyElement = function({
-  children
-}) {
-  const { items, setHasEmpty } = useCombobox$1();
-  useEffect(() => {
-    setHasEmpty?.(true);
-    return () => {
-      setHasEmpty?.(false);
-    };
-  });
-  if (!supportsPopover()) return;
-  return !items.length ? children : null;
-};
-const ComboboxEmpty = function({
-  children
-}) {
-  if (!supportsPopover())
-    return /* @__PURE__ */ jsx(ComboboxLegacyEmpty, { children });
-  return /* @__PURE__ */ jsx(ComboboxEmptyElement, { children });
-};
-
-const item = "_item_11q9l_22";
-const group = "_group_11q9l_35";
-const combobox = "_combobox_11q9l_50";
-const listview = "_listview_11q9l_59";
-const empty = "_empty_11q9l_63";
-const Icon = "_Icon_11q9l_117";
-const scrolled = "_scrolled_11q9l_165";
-const styles = {
-	item: item,
-	group: group,
-	combobox: combobox,
-	"popover-content": "_popover-content_11q9l_54",
-	listview: listview,
-	empty: empty,
-	"group-title": "_group-title_11q9l_75",
-	"group-list": "_group-list_11q9l_81",
-	Icon: Icon,
-	"scroll-sentinel": "_scroll-sentinel_11q9l_120",
-	"listview-option": "_listview-option_11q9l_129",
-	"select-all": "_select-all_11q9l_159",
-	scrolled: scrolled
-};
-
-function useGroups({
-  items,
-  groupBy,
-  groupToString,
-  groupSorter = (a, b) => `${a}`.localeCompare(`${b}`)
-}) {
-  const { groups, orderedItems } = useMemo(() => {
-    if (!groupBy) return { groups: [], orderedItems: items };
-    const groupsSansItems = [];
-    const groupedItems = {};
-    items.forEach((item) => {
-      const groupKey = item[groupBy];
-      if (!groupedItems[groupKey]) {
-        groupedItems[groupKey] = [];
-      }
-      groupedItems[groupKey].push(item);
-    });
-    Object.keys(groupedItems).forEach((key) => {
-      groupsSansItems.push({
-        key,
-        label: groupToString ? groupToString?.(key) : key
-      });
-    });
-    groupsSansItems.sort((a, b) => groupSorter(a.key, b.key));
-    const orderedItems2 = [];
-    const groups2 = groupsSansItems.map((group) => ({
-      ...group,
-      items: groupedItems[group.key].map((item) => {
-        orderedItems2.push(item);
-        return item;
-      })
-    }));
-    return { groups: groups2, orderedItems: orderedItems2 };
-  }, [groupBy, groupSorter, groupToString, items]);
-  return { groups, orderedItems };
-}
-
-const SelectSingle = function(props) {
-  const { layoutStyles, componentProps } = useLayoutPropsUtil(props);
-  const {
-    className,
-    style,
-    children,
-    open,
-    disabled,
-    readOnly,
-    items,
-    itemToString: itemToStringProp,
-    itemToKey: itemToKeyProp,
-    onChange,
-    disableClearSelection = false,
-    disableCloseOnClickOutside = false,
-    disableMatchReferenceWidth = false,
-    disableCloseOnSelectItem = false,
-    loading = false,
-    minPopoverHeight,
-    root,
-    environment: environmentProp,
-    groupBy,
-    groupToString,
-    ...rest
-  } = componentProps;
-  const ComboboxClassNames = cx(styles["combobox"], className);
-  const [hasDisabledPopover, setHasDisabledPopover] = useState(false);
-  const [hasEmpty, setHasEmpty] = useState(false);
-  const [disabledItems, setDisabledItems] = useState([]);
-  const [forceCloseOnSelectItems, setForceCloseOnSelectItems] = useState([]);
-  const [, setForceClearInputValueOnSelectItems] = useState([]);
-  const [isReadOnly, setIsReadOnly] = useState(readOnly);
-  const [isDisabled, setIsDisabled] = useState(disabled);
-  const referenceRef = useRef(null);
-  const contentRef = useRef(null);
-  const listRef = useRef(null);
-  const handleOutsidePress = (_e) => {
-    if (disableCloseOnClickOutside) return;
-    closeMenu();
-  };
-  const { ref: wrapperDivRef, environment } = useDownshiftEnvironment$1();
-  const itemToString = itemToStringProp ?? defaultItemToString$1;
-  const itemToKey = itemToKeyProp ?? defaultItemToKey$1;
-  const { groups, orderedItems } = useGroups({
-    items,
-    groupBy,
-    groupToString
-  });
-  const {
-    isOpen,
-    getLabelProps,
-    getToggleButtonProps,
-    getMenuProps,
-    getItemProps,
-    highlightedIndex,
-    selectedItem,
-    selectItem,
-    inputValue,
-    closeMenu
-  } = useSelect({
-    ...rest,
-    items: orderedItems,
-    itemToString,
-    itemToKey,
-    isOpen: open,
-    initialIsOpen: open,
-    environment: environmentProp ?? environment,
-    // NOTE: Reducer needs to be pure, side-effects should be in event handlers
-    stateReducer(state, { type, changes }) {
-      switch (type) {
-        case useSelect.stateChangeTypes.ToggleButtonKeyDownEnter:
-        case useSelect.stateChangeTypes.ItemClick:
-          return {
-            ...changes,
-            isOpen: open != null ? open : forceCloseOnSelectItems.includes(changes.selectedItem) ? false : disableCloseOnSelectItem ? true : changes.isOpen,
-            highlightedIndex: disableCloseOnSelectItem ? state.highlightedIndex : changes.highlightedIndex
-          };
-        default:
-          return changes;
-      }
-    },
-    onSelectedItemChange(changes) {
-      const { selectedItem: selectedItem2 } = changes;
-      if (onChange != null)
-        onChange(selectedItem2 != null ? selectedItem2 : null);
-    },
-    isItemDisabled(item) {
-      if (isDisabled || isReadOnly) {
-        return !!isDisabled || !!isReadOnly;
-      }
-      if (item && item instanceof Object && "disabled" in item && item.disabled) {
-        return true;
-      }
-      if (item && item instanceof Object && "readOnly" in item && item.readOnly) {
-        return true;
-      }
-      if (disabledItems.includes(item)) {
-        return true;
-      }
-      return false;
-    }
-  });
-  useEffect(() => {
-    setIsDisabled(disabled);
-  }, [disabled]);
-  useEffect(() => {
-    setIsReadOnly(readOnly);
-  }, [readOnly]);
-  return /* @__PURE__ */ jsx(
-    ComboboxContext.Provider,
-    {
-      value: {
-        multiple: false,
-        select: true,
-        disableClearSelection,
-        items: orderedItems,
-        itemToString,
-        itemToKey,
-        isOpen,
-        getLabelProps,
-        getToggleButtonProps,
-        getMenuProps,
-        getItemProps,
-        highlightedIndex,
-        selectedItem,
-        selectedItems: [],
-        disabledItems,
-        setDisabledItems,
-        setForceCloseOnSelectItems,
-        setForceClearInputValueOnSelectItems,
-        selectItem,
-        inputValue,
-        isDisabled,
-        isReadOnly,
-        setIsReadOnly,
-        setIsDisabled,
-        hasDisabledPopover,
-        setHasDisabledPopover,
-        hasEmpty,
-        setHasEmpty,
-        loading,
-        referenceRef,
-        contentRef,
-        closeMenu,
-        groups,
-        groupBy,
-        groupToString,
-        listRef
-      },
-      children: /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: ComboboxClassNames,
-          "data-anv": "combobox",
-          style: { ...style, ...layoutStyles },
-          ref: wrapperDivRef,
-          children: /* @__PURE__ */ jsx(
-            Popover,
-            {
-              open: isOpen,
-              noPadding: true,
-              disableCaret: true,
-              fitScreen: true,
-              disableFlipFallback: true,
-              placement: "bottom-start",
-              matchReferenceWidth: !disableMatchReferenceWidth,
-              disableCloseOnClickOutside,
-              onOutsidePress: handleOutsidePress,
-              minHeight: minPopoverHeight,
-              children
-            }
-          )
-        }
-      )
-    }
-  );
-};
-const SelectMultiple = function(props) {
-  const { layoutStyles, componentProps } = useLayoutPropsUtil(props);
-  const {
-    className,
-    style,
-    children,
-    open,
-    items,
-    itemToString: itemToStringProp,
-    itemToKey: itemToKeyProp,
-    onChange,
-    onSelectedItemsChange,
-    onStateChange,
-    disableCloseOnClickOutside = false,
-    disableMatchReferenceWidth = false,
-    disableCloseOnSelectItem = false,
-    loading = false,
-    minPopoverHeight,
-    root,
-    disabled,
-    readOnly,
-    stateReducer: _,
-    initialSelectedItems,
-    initialActiveIndex,
-    defaultSelectedItems,
-    defaultActiveIndex,
-    activeIndex: activeIndexProp,
-    selectedItems: selectedItemsProp,
-    environment: environmentProp,
-    groupBy,
-    groupToString,
-    selectAll,
-    ...rest
-  } = componentProps;
-  const ComboboxClassNames = cx(styles["combobox"], className);
-  const [hasDisabledPopover, setHasDisabledPopover] = useState(false);
-  const [hasEmpty, setHasEmpty] = useState(false);
-  const [disabledItems, setDisabledItems] = useState([]);
-  const [forceCloseOnSelectItems, setForceCloseOnSelectItems] = useState([]);
-  const [, setForceClearInputValueOnSelectItems] = useState([]);
-  const [isReadOnly, setIsReadOnly] = useState(readOnly);
-  const [isDisabled, setIsDisabled] = useState(disabled);
-  const referenceRef = useRef(null);
-  const contentRef = useRef(null);
-  const listRef = useRef(null);
-  const handleOutsidePress = (_e) => {
-    if (disableCloseOnClickOutside) return;
-    closeMenu();
-  };
-  const { ref: wrapperDivRef, environment } = useDownshiftEnvironment$1();
-  const itemToString = itemToStringProp ?? defaultItemToString$1;
-  const itemToKey = itemToKeyProp ?? defaultItemToKey$1;
-  const { groups, orderedItems: orderedItemsBase } = useGroups({
-    items,
-    groupBy,
-    groupToString
-  });
-  const orderedItems = selectAll ? [SELECT_ALL, ...orderedItemsBase] : orderedItemsBase;
-  const {
-    getSelectedItemProps,
-    getDropdownProps,
-    reset,
-    selectedItems,
-    addSelectedItem,
-    removeSelectedItem,
-    setSelectedItems
-  } = useMultipleSelection({
-    itemToKey,
-    initialSelectedItems,
-    initialActiveIndex,
-    defaultSelectedItems,
-    defaultActiveIndex,
-    activeIndex: activeIndexProp,
-    selectedItems: selectedItemsProp,
-    environment: environmentProp ?? environment,
-    stateReducer(state, { type, changes }) {
-      switch (type) {
-        // the Chip itself will handle "Backspace" and "Delete"
-        // just return previous state
-        case useMultipleSelection.stateChangeTypes.SelectedItemKeyDownBackspace:
-        case useMultipleSelection.stateChangeTypes.SelectedItemKeyDownDelete:
-          return state;
-        case useMultipleSelection.stateChangeTypes.FunctionRemoveSelectedItem:
-          return { ...changes, activeIndex: -1 };
-        case useMultipleSelection.stateChangeTypes.FunctionReset:
-          return { ...changes, selectedItems: [] };
-        default:
-          return changes;
-      }
-    },
-    onStateChange,
-    onSelectedItemsChange(changes) {
-      const { selectedItems: selectedItems2 } = changes;
-      if (onChange != null) onChange(selectedItems2);
-      if (onSelectedItemsChange != null) onSelectedItemsChange(changes);
-    }
-  });
-  const {
-    isOpen,
-    getLabelProps,
-    getToggleButtonProps,
-    getMenuProps,
-    getItemProps,
-    highlightedIndex,
-    selectedItem,
-    selectItem,
-    inputValue,
-    closeMenu
-  } = useSelect({
-    ...rest,
-    items: orderedItems,
-    itemToString,
-    itemToKey,
-    selectedItem: null,
-    isOpen: open,
-    initialIsOpen: open,
-    environment: environmentProp ?? environment,
-    // NOTE: Reducer needs to be pure, side-effects should be in event handlers
-    stateReducer(state, { type, changes }) {
-      switch (type) {
-        case useSelect.stateChangeTypes.ToggleButtonKeyDownEnter:
-        case useSelect.stateChangeTypes.ItemClick:
-          return {
-            ...changes,
-            isOpen: open != null ? open : forceCloseOnSelectItems.includes(changes.selectedItem) ? false : disableCloseOnSelectItem ? true : changes.isOpen,
-            highlightedIndex: disableCloseOnSelectItem ? state.highlightedIndex : changes.highlightedIndex
-          };
-        default:
-          return changes;
-      }
-    },
-    onStateChange(changes) {
-      const { type, selectedItem: newSelectedItem } = changes;
-      switch (type) {
-        case useSelect.stateChangeTypes.ToggleButtonKeyDownEnter:
-        case useSelect.stateChangeTypes.ItemClick:
-        case useSelect.stateChangeTypes.ToggleButtonBlur:
-          if (changes.selectedItem === SELECT_ALL) {
-            selectAll?.onSelection();
-            return {
-              ...changes,
-              selectedItem: null
-            };
-          }
-          if (newSelectedItem != null) {
-            const itemAlreadySelected = selectedItems.some(
-              (item) => itemToKey(item) === itemToKey(newSelectedItem)
-            );
-            if (itemAlreadySelected) {
-              removeSelectedItem(newSelectedItem);
-            } else {
-              addSelectedItem(newSelectedItem);
-            }
-          }
-          break;
-      }
-      onStateChange?.(changes);
-    },
-    isItemDisabled(item) {
-      if (isDisabled || isReadOnly) {
-        return !!isDisabled || !!isReadOnly;
-      }
-      if (item && item instanceof Object && "disabled" in item && item.disabled) {
-        return true;
-      }
-      if (item && item instanceof Object && "readOnly" in item && item.readOnly) {
-        return true;
-      }
-      if (disabledItems.includes(item)) {
-        return true;
-      }
-      return false;
-    },
-    onHighlightedIndexChange(changes) {
-      if (selectAll && changes.highlightedIndex === 0 && [
-        useSelect.stateChangeTypes.ToggleButtonKeyDownArrowDown,
-        useSelect.stateChangeTypes.ToggleButtonKeyDownArrowUp,
-        useSelect.stateChangeTypes.ToggleButtonKeyDownPageDown,
-        useSelect.stateChangeTypes.ToggleButtonKeyDownPageUp,
-        useSelect.stateChangeTypes.ToggleButtonKeyDownHome,
-        useSelect.stateChangeTypes.ToggleButtonKeyDownEnd
-      ].includes(changes.type) && listRef.current) {
-        const scrollParent = getScrollParent(listRef.current);
-        if (scrollParent) {
-          scrollParent.scrollTop = 0;
-        }
-      }
-    }
-  });
-  useEffect(() => {
-    setIsDisabled(disabled);
-  }, [disabled]);
-  useEffect(() => {
-    setIsReadOnly(readOnly);
-  }, [readOnly]);
-  return /* @__PURE__ */ jsx(
-    ComboboxContext.Provider,
-    {
-      value: {
-        multiple: true,
-        select: true,
-        items: orderedItems,
-        itemToString,
-        itemToKey,
-        isOpen,
-        getLabelProps,
-        getToggleButtonProps,
-        getMenuProps,
-        getItemProps,
-        highlightedIndex,
-        selectedItem,
-        selectedItems,
-        disabledItems,
-        setDisabledItems,
-        setForceCloseOnSelectItems,
-        setForceClearInputValueOnSelectItems,
-        getSelectedItemProps,
-        getDropdownProps,
-        reset,
-        addSelectedItem,
-        removeSelectedItem,
-        setSelectedItems,
-        selectItem,
-        inputValue,
-        isDisabled,
-        isReadOnly,
-        setIsReadOnly,
-        setIsDisabled,
-        hasDisabledPopover,
-        setHasDisabledPopover,
-        hasEmpty,
-        setHasEmpty,
-        loading,
-        referenceRef,
-        contentRef,
-        closeMenu,
-        groupBy,
-        groupToString,
-        groups,
-        listRef,
-        selectAll
-      },
-      children: /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: ComboboxClassNames,
-          "data-anv": "combobox",
-          style: { ...style, ...layoutStyles },
-          ref: wrapperDivRef,
-          children: /* @__PURE__ */ jsx(
-            Popover,
-            {
-              open: !isDisabled && isOpen,
-              noPadding: true,
-              disableCaret: true,
-              fitScreen: true,
-              disableFlipFallback: true,
-              placement: "bottom-start",
-              matchReferenceWidth: !disableMatchReferenceWidth,
-              disableCloseOnClickOutside,
-              onOutsidePress: handleOutsidePress,
-              minHeight: minPopoverHeight,
-              children
-            }
-          )
-        }
-      )
-    }
-  );
-};
-const ComboboxSelect = function(props) {
-  if (!supportsPopover()) {
-    if (isMultiple(props)) {
-      return /* @__PURE__ */ jsx(SelectLegacyMultiple, { ...props });
-    } else {
-      return /* @__PURE__ */ jsx(SelectLegacySingle, { ...props });
-    }
-  }
-  if (isMultiple(props)) {
-    return /* @__PURE__ */ jsx(SelectMultiple, { ...props });
-  } else {
-    return /* @__PURE__ */ jsx(SelectSingle, { ...props });
-  }
-};
-
-const ComboboxItemVisual = forwardRef(
-  ({
-    children,
-    disabled,
-    checked,
-    hideCheckbox,
-    rootDivProps,
-    flexProps
-  }, ref) => {
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        ref,
-        "data-anv": "combobox-item",
-        ...rootDivProps,
-        className: cx(
-          styles["listview-option"],
-          listViewStyles["listview-option"],
-          rootDivProps.className
-        ),
-        children: [
-          !hideCheckbox ? /* @__PURE__ */ jsx("div", { className: cx(styles["cell"], listViewStyles["cell"]), children: /* @__PURE__ */ jsx("div", { className: checkboxStyles["wrapper"], children: /* @__PURE__ */ jsxs("div", { className: checkboxStyles["checkbox"], children: [
-            /* @__PURE__ */ jsx(
-              "input",
-              {
-                type: "checkbox",
-                checked,
-                "aria-checked": checked,
-                "aria-label": "Select",
-                readOnly: true,
-                tabIndex: -1,
-                ...disabled ? { disabled: true } : {}
-              }
-            ),
-            /* @__PURE__ */ jsxs("span", { className: checkboxStyles["icon-wrapper"], "aria-hidden": true, children: [
-              /* @__PURE__ */ jsx(
-                Icon$2,
-                {
-                  size: "large",
-                  svg: SvgIndeterminateCheckBox,
-                  className: checkboxStyles["icon-indeterminate"]
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                Icon$2,
-                {
-                  size: "large",
-                  svg: SvgCheckBox,
-                  className: checkboxStyles["icon-checked"]
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                Icon$2,
-                {
-                  size: "large",
-                  svg: SvgCheckBoxOutlineBlank,
-                  className: checkboxStyles["icon-unchecked"]
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsx("span", { "aria-hidden": true })
-          ] }) }) }) : null,
-          /* @__PURE__ */ jsx(Flex, { grow: 1, shrink: 1, ...flexProps, children })
-        ]
-      }
-    );
-  }
-);
-ComboboxItemVisual.displayName = "ComboboxItemVisual";
-
-const ComboboxSelectAll = function({ className }) {
-  const {
-    getItemProps,
-    setForceCloseOnSelectItems,
-    highlightedIndex,
-    items,
-    selectAll
-  } = useCombobox$1();
-  const item = SELECT_ALL;
-  const index = items.indexOf(item);
-  const ref = useRef(null);
-  useEffect(() => {
-    return () => {
-      setForceCloseOnSelectItems((forceCloseOnSelectItems) => {
-        if (forceCloseOnSelectItems.includes(item)) {
-          return forceCloseOnSelectItems.filter(
-            (prevItem) => prevItem !== item
-          );
-        } else {
-          return forceCloseOnSelectItems;
-        }
-      });
-    };
-  }, [item, setForceCloseOnSelectItems]);
-  return /* @__PURE__ */ jsx(
-    ComboboxItemVisual,
-    {
-      ref,
-      rootDivProps: getItemProps({
-        item: SELECT_ALL,
-        index,
-        "aria-selected": highlightedIndex === index,
-        className: cx(styles["select-all"], className)
-      }),
-      hideCheckbox: false,
-      disabled: false,
-      checked: !!selectAll?.isChecked,
-      children: selectAll?.label
-    },
-    "select-all"
-  );
-};
-
-const ComboboxGroupContext = createContext(null);
-const useComboboxGroupContext = () => useContext(ComboboxGroupContext);
-
-const ComboboxGroupList = function({
-  children,
-  ...rest
-}) {
-  const {
-    getMenuProps,
-    multiple,
-    items,
-    hasAddNew = false,
-    hasEmpty,
-    loading,
-    selectAll,
-    listRef
-  } = useCombobox$1();
-  const scrollSentinelRef = useRef(null);
-  const [isScrolled, setIsScrolled] = useState(false);
-  const { key: groupKey } = useComboboxGroupContext() ?? {};
-  const isAGroup = !!groupKey;
-  useEffect(() => {
-    if (!scrollSentinelRef.current) return;
-    const intersectionObserver = new IntersectionObserver(
-      (entries) => {
-        entries.forEach((entry) => {
-          if (!entry.isIntersecting) {
-            setIsScrolled(true);
-          } else {
-            setIsScrolled(false);
-          }
-        });
-      },
-      { threshold: 0 }
-    );
-    intersectionObserver.observe(scrollSentinelRef.current);
-    return () => {
-      intersectionObserver.disconnect();
-    };
-  }, [scrollSentinelRef, setIsScrolled]);
-  if (!supportsPopover())
-    return /* @__PURE__ */ jsx(ComboboxLegacyList, { ...rest, children });
-  if (isAGroup) {
-    return /* @__PURE__ */ jsx(Fragment, { children });
-  }
-  if (multiple) {
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsxs(
-        "ul",
-        {
-          ...getMenuProps(rest),
-          ref: listRef,
-          "data-anv": "combobox-list",
-          className: cx(styles["listview"], listViewStyles["listview"], {
-            [styles.scrolled]: isScrolled
-          }),
-          style: {
-            display: items.length || hasAddNew ? void 0 : "none"
-          },
-          children: [
-            /* @__PURE__ */ jsx("div", { ref: scrollSentinelRef, className: styles["scroll-sentinel"] }),
-            !loading && selectAll && /* @__PURE__ */ jsxs(Fragment, { children: [
-              /* @__PURE__ */ jsx(ComboboxSelectAll, {}),
-              /* @__PURE__ */ jsx(Divider, {})
-            ] }),
-            children
-          ]
-        }
-      ),
-      loading ? /* @__PURE__ */ jsx("div", { className: styles["empty"], children: /* @__PURE__ */ jsx(Flex, { justifyContent: "center", children: /* @__PURE__ */ jsx(Spinner, { size: "small" }) }) }) : !items.length && !hasEmpty ? /* @__PURE__ */ jsx("div", { className: styles["empty"], children: /* @__PURE__ */ jsx(Text, { subdued: true, size: "small", children: "No match found" }) }) : null
-    ] });
-  } else {
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(
-        "ul",
-        {
-          ...getMenuProps(rest),
-          ref: listRef,
-          "data-anv": "combobox-list",
-          className: listboxStyles["listbox"],
-          style: {
-            display: items.length || hasAddNew ? void 0 : "none"
-          },
-          children
-        }
-      ),
-      loading ? /* @__PURE__ */ jsx("div", { className: styles["empty"], children: /* @__PURE__ */ jsx(Flex, { justifyContent: "center", children: /* @__PURE__ */ jsx(Spinner, { size: "small" }) }) }) : !items.length && !hasEmpty ? /* @__PURE__ */ jsx("div", { className: styles["empty"], children: /* @__PURE__ */ jsx(Text, { subdued: true, size: "small", children: "No match found" }) }) : null
-    ] });
-  }
-};
-
-const ComboboxGroupProvider = ComboboxGroupContext.Provider;
-
-const ComboboxContentElement = function({
-  children,
-  className,
-  disablePopover = false,
-  ...rest
-}) {
-  const {
-    items,
-    itemToKey,
-    inputValue,
-    selectedItem,
-    selectedItems,
-    setHasDisabledPopover,
-    getMenuProps,
-    getItemProps,
-    isDisabled,
-    isReadOnly,
-    contentRef,
-    closeMenu,
-    groups
-  } = useCombobox$1();
-  const ComboboxPopoverContentClassNames = cx(
-    styles["popover-content"],
-    className
-  );
-  useEffect(() => {
-    setHasDisabledPopover(disablePopover);
-    return () => {
-      setHasDisabledPopover(false);
-    };
-  }, [disablePopover, setHasDisabledPopover]);
-  const context = usePopoverContext();
-  const handleBlur = (_e) => {
-    if (context?.controlled) return;
-    context?.popover.close?.(closeMenu);
-  };
-  const resolveChildren = (groupItems) => children?.({
-    items: groupItems,
-    inputValue,
-    selectedItem,
-    getMenuProps,
-    getItemProps,
-    listProps: {
-      ...getMenuProps({}, { suppressRefError: true }),
-      style: {
-        display: groupItems.length ? void 0 : "none",
-        overflow: "auto"
-      }
-    },
-    options: groupItems.map((item, index) => ({
-      optionProps: {
-        ...getItemProps({
-          item,
-          index
-        }),
-        tabIndex: disablePopover ? -1 : void 0,
-        selected: itemToKey(selectedItem) === itemToKey(item) || selectedItems.some(
-          (selectedItem2) => itemToKey(selectedItem2) === itemToKey(item)
-        ),
-        disabled: !!isDisabled || !!isReadOnly
-        // also see "isItemDisabled" function
-      },
-      item,
-      index
-    }))
-  });
-  const id = useId();
-  const filterAlreadyRenderedItems = (items2) => {
-    return items2.filter((item) => item !== ADD_NEW$1 && item !== SELECT_ALL);
-  };
-  return disablePopover ? /* @__PURE__ */ jsx(
-    "div",
-    {
-      ...rest,
-      className: ComboboxPopoverContentClassNames,
-      ref: contentRef,
-      onBlur: handleBlur,
-      children: groups?.length ? /* @__PURE__ */ jsx(ComboboxGroupList, { children: groups.map((group, i) => /* @__PURE__ */ jsxs(ComboboxGroupProvider, { value: group, children: [
-        i !== 0 && /* @__PURE__ */ jsx(Divider, {}),
-        /* @__PURE__ */ jsxs(
-          "li",
-          {
-            "aria-labelledby": `${id}-group-${group.key}`,
-            className: cx(styles["group"], listboxStyles["listbox"]),
-            "data-anv": "combobox-group",
-            role: "group",
-            children: [
-              group.label != null ? /* @__PURE__ */ jsx(
-                Text,
-                {
-                  className: styles["group-title"],
-                  id: `${id}-group-${group.key}`,
-                  variant: "eyebrow",
-                  children: group.label
-                }
-              ) : null,
-              /* @__PURE__ */ jsx("ul", { className: styles["group-list"], children: resolveChildren(filterAlreadyRenderedItems(group.items)) })
-            ]
-          }
-        )
-      ] }, group.key)) }) : resolveChildren(filterAlreadyRenderedItems(items))
-    }
-  ) : /* @__PURE__ */ jsx(
-    Popover.Content,
-    {
-      "data-anv": "combobox-content",
-      ...rest,
-      className: ComboboxPopoverContentClassNames,
-      ref: getMenuProps({ ref: contentRef }, { suppressRefError: true }).ref,
-      tabIndex: -1,
-      onBlur: handleBlur,
-      children: groups?.length ? /* @__PURE__ */ jsx(ComboboxGroupList, { children: groups.map((group, i) => /* @__PURE__ */ jsxs(ComboboxGroupProvider, { value: group, children: [
-        i !== 0 && /* @__PURE__ */ jsx(Divider, {}),
-        /* @__PURE__ */ jsxs(
-          "li",
-          {
-            "aria-labelledby": `${id}-group-${group.key}`,
-            className: cx(styles["group"], listboxStyles["listbox"]),
-            "data-anv": "combobox-group",
-            role: "group",
-            children: [
-              group.label != null ? /* @__PURE__ */ jsx(
-                Text,
-                {
-                  className: styles["group-title"],
-                  id: `${id}-group-${group.key}`,
-                  variant: "eyebrow",
-                  children: group.label
-                }
-              ) : null,
-              /* @__PURE__ */ jsx("ul", { className: styles["group-list"], children: resolveChildren(filterAlreadyRenderedItems(group.items)) })
-            ]
-          }
-        )
-      ] }, group.key)) }) : resolveChildren(filterAlreadyRenderedItems(items))
-    }
-  );
-};
-const ComboboxContent = function({
-  children,
-  className,
-  disablePopover = false,
-  ...rest
-}) {
-  if (!supportsPopover())
-    return /* @__PURE__ */ jsx(
-      ComboboxLegacyContent,
-      {
-        disablePopover,
-        className,
-        ...rest,
-        children
-      }
-    );
-  return /* @__PURE__ */ jsx(
-    ComboboxContentElement,
-    {
-      className,
-      disablePopover,
-      ...rest,
-      children
-    }
-  );
-};
-
-const ComboboxTrigger = function(props) {
-  const { layoutStyles, componentProps } = useLayoutPropsUtil(props);
-  const {
-    // variant: variantProp = "combobox",
-    className,
-    style,
-    label,
-    size,
-    error,
-    hint,
-    description,
-    required,
-    moreInfo,
-    openMoreInfo,
-    prefix,
-    suffix,
-    maxRows,
-    selectedItemProps = () => ({}),
-    id,
-    placeholder,
-    disabled,
-    readOnly,
-    onClear,
-    ...rest
-  } = componentProps;
-  const {
-    select,
-    disableClearSelection,
-    itemToString,
-    getLabelProps,
-    getInputProps,
-    getToggleButtonProps,
-    getMenuProps,
-    selectedItem,
-    selectedItems,
-    getSelectedItemProps,
-    getDropdownProps,
-    reset,
-    removeSelectedItem,
-    selectItem,
-    inputValue,
-    isDisabled,
-    isReadOnly,
-    referenceRef,
-    closeMenu,
-    setIsDisabled,
-    setIsReadOnly
-  } = useCombobox$1();
-  const context = usePopoverContext();
-  useLayoutEffect(() => {
-    if (typeof disabled === "undefined") return;
-    setIsDisabled(disabled);
-  }, [disabled, setIsDisabled]);
-  useLayoutEffect(() => {
-    if (typeof readOnly === "undefined") return;
-    setIsReadOnly(readOnly);
-  }, [readOnly, setIsReadOnly]);
-  const handleBlur = (e) => {
-    const target = e.relatedTarget ?? e.target;
-    const focusedOnReference = context?.invoker.ref.current && context?.invoker.ref.current.contains(target);
-    const focusedOnContent = context?.popover.ref.current && context?.popover.ref.current.contains(target) || context?.popover.element?.contains(target);
-    if (!focusedOnReference && !focusedOnContent || !e.relatedTarget) {
-      closeMenu();
-    }
-  };
-  const labelProps = getLabelProps({
-    required,
-    moreInfo,
-    openMoreInfo
-  });
-  const inputRef = useRef(null);
-  const inputWrapperProps = {
-    ...select ? {
-      ...getToggleButtonProps({
-        disabled: isDisabled,
-        readOnly: isReadOnly,
-        id,
-        ref: context?.invoker.ref
-      })
-    } : {
-      onClick: () => inputRef.current?.focus(),
-      ref: context?.invoker.ref
-    }
-  };
-  const toggleButtonProps = select ? {} : getToggleButtonProps();
-  const handleClearButtonClick = (_e) => {
-    if (onClear) {
-      onClear();
-    } else {
-      if (reset != null) {
-        reset();
-      } else {
-        selectItem(null);
-      }
-    }
-  };
-  const styleCombined = {
-    ...style,
-    ...layoutStyles
-  };
-  return /* @__PURE__ */ jsx(
-    SelectTriggerBase,
-    {
-      "data-anv": select ? "combobox-select-trigger" : "combobox-search-field",
-      className,
-      style: styleCombined,
-      label,
-      size,
-      error,
-      hint,
-      description,
-      prefix,
-      suffix,
-      maxRows,
-      selectedItemProps,
-      placeholder,
-      labelProps,
-      inputWrapperProps,
-      toggleButtonProps,
-      itemToString,
-      removeSelectedItem,
-      variant: select ? "select" : "combobox",
-      disableClearSelection,
-      selectedItem,
-      selectedItems,
-      inputValue,
-      disabled: isDisabled,
-      readOnly: isReadOnly,
-      referenceRef,
-      onBlur: handleBlur,
-      onClearButtonClick: handleClearButtonClick,
-      chipProps: (item, index) => {
-        if (getSelectedItemProps != null) {
-          const { onClick: _, ...chipProps } = getSelectedItemProps({
-            selectedItem: item,
-            index
-          });
-          return chipProps;
-        }
-        return {};
-      },
-      inputProps: select ? {
-        ...getDropdownProps != null ? getDropdownProps({
-          required,
-          preventKeyAction: false
-        }) : {
-          required
-        },
-        ["aria-expanded"]: context?.invoker["aria-expanded"],
-        ["aria-details"]: getMenuProps().id,
-        ["aria-haspopup"]: context?.invoker["aria-haspopup"]
-      } : {
-        ["aria-expanded"]: context?.invoker["aria-expanded"],
-        ["aria-details"]: getMenuProps().id,
-        ["aria-haspopup"]: context?.invoker["aria-haspopup"],
-        ["aria-controls"]: getMenuProps().id,
-        ...getDropdownProps != null && getInputProps != null ? getInputProps(
-          getDropdownProps({
-            ...rest,
-            disabled: isDisabled,
-            readOnly: isReadOnly,
-            required,
-            autoComplete: "off",
-            id,
-            preventKeyAction: false,
-            ref: inputRef
-          })
-        ) : getInputProps != null ? getInputProps({
-          ...rest,
-          disabled: isDisabled,
-          readOnly: isReadOnly,
-          required,
-          autoComplete: "off",
-          id,
-          ref: inputRef
-        }) : {}
-      }
-    }
-  );
-};
-const ComboboxSearchFieldElement = function({
-  onClear,
-  ...props
-}) {
-  if (!supportsPopover())
-    return /* @__PURE__ */ jsx(ComboboxLegacyTrigger, { ...props, variant: "combobox" });
-  return /* @__PURE__ */ jsx(ComboboxTrigger, { onClear, ...props, variant: "combobox" });
-};
-const ComboboxSearchField = function({
-  prefix: prefixProp,
-  ...props
-}) {
-  const data = {
-    label: childrenToString(props.label),
-    size: props.size,
-    required: props.required,
-    moreInfo: props.moreInfo,
-    openMoreInfo: props.openMoreInfo,
-    description: childrenToString(props.description),
-    hint: props.hint,
-    labelProps: props.labelProps
-  };
-  const trackingId = useTrackingId({
-    name: "ComboboxSearchField",
-    data,
-    hasOverride: !!props["data-tracking-id"]
-  });
-  const prefix = prefixProp == null || typeof prefixProp === "string" ? prefixProp : "icon" in prefixProp ? /* @__PURE__ */ jsx(Icon$2, { ...prefixProp.icon }) : "avatar" in prefixProp ? /* @__PURE__ */ jsx(
-    Avatar,
-    {
-      ...prefixProp.avatar,
-      size: props.size === "small" ? "small" : "medium"
-    }
-  ) : prefixProp;
-  return /* @__PURE__ */ jsx(
-    ComboboxSearchFieldElement,
-    {
-      "data-tracking-id": trackingId,
-      ...props,
-      prefix
-    }
-  );
-};
-const ComboboxSelectTriggerElement = function(props) {
-  if (!supportsPopover())
-    return /* @__PURE__ */ jsx(ComboboxLegacyTrigger, { ...props, variant: "select" });
-  return /* @__PURE__ */ jsx(ComboboxTrigger, { ...props, variant: "select" });
-};
-const ComboboxSelectTrigger = function({
-  prefix: prefixProp,
-  ...props
-}) {
-  const data = {
-    label: childrenToString(props.label),
-    size: props.size,
-    required: props.required,
-    moreInfo: props.moreInfo,
-    openMoreInfo: props.openMoreInfo,
-    description: childrenToString(props.description),
-    hint: props.hint,
-    labelProps: props.labelProps
-  };
-  const trackingId = useTrackingId({
-    name: "ComboboxSearchField",
-    data,
-    hasOverride: !!props["data-tracking-id"]
-  });
-  const prefix = prefixProp == null || typeof prefixProp === "string" ? prefixProp : "icon" in prefixProp ? /* @__PURE__ */ jsx(Icon$2, { ...prefixProp.icon }) : "avatar" in prefixProp ? /* @__PURE__ */ jsx(
-    Avatar,
-    {
-      ...prefixProp.avatar,
-      size: props.size === "small" ? "small" : "medium"
-    }
-  ) : prefixProp;
-  return /* @__PURE__ */ jsx(
-    ComboboxSelectTriggerElement,
-    {
-      "data-tracking-id": trackingId,
-      ...props,
-      prefix
-    }
-  );
-};
-
-const CoreComboboxItemElement = function({
-  children,
-  disabled: disabledProp,
-  item,
-  index: indexProp,
-  hideCheckbox,
-  forceCloseOnSelect,
-  forceClearInputValueOnSelect,
-  alignItems,
-  justifyItems,
-  alignContent,
-  justifyContent,
-  placeItems,
-  placeContent,
-  gap,
-  rowGap,
-  columnGap,
-  ...rest
-}) {
-  const {
-    itemToKey,
-    getItemProps,
-    multiple,
-    selectedItem,
-    selectedItems,
-    disabledItems,
-    setDisabledItems,
-    setForceCloseOnSelectItems,
-    setForceClearInputValueOnSelectItems,
-    highlightedIndex,
-    items
-  } = useCombobox$1();
-  const index = item === ADD_NEW$1 && !multiple ? indexProp : items.indexOf(item);
-  const disabled = disabledProp || item && item instanceof Object && "disabled" in item && item.disabled;
-  useEffect(() => {
-    if (disabledProp && !disabledItems.includes(item)) {
-      setDisabledItems([...disabledItems, item]);
-    } else if (disabledItems.includes(item)) {
-      setDisabledItems(disabledItems.filter((prevItem) => prevItem !== item));
-    }
-    return () => {
-      if (disabledItems.includes(item)) {
-        setDisabledItems(disabledItems.filter((prevItem) => prevItem !== item));
-      }
-    };
-  }, [item, disabledProp, setDisabledItems]);
-  useEffect(() => {
-    if (forceCloseOnSelect) {
-      setForceCloseOnSelectItems((forceCloseOnSelectItems) => {
-        if (forceCloseOnSelectItems.includes(item)) {
-          return forceCloseOnSelectItems;
-        } else {
-          return [...forceCloseOnSelectItems, item];
-        }
-      });
-    }
-    return () => {
-      setForceCloseOnSelectItems((forceCloseOnSelectItems) => {
-        if (forceCloseOnSelectItems.includes(item)) {
-          return forceCloseOnSelectItems.filter(
-            (prevItem) => prevItem !== item
-          );
-        } else {
-          return forceCloseOnSelectItems;
-        }
-      });
-    };
-  }, [item, forceCloseOnSelect, setForceCloseOnSelectItems]);
-  useEffect(() => {
-    if (forceClearInputValueOnSelect) {
-      setForceClearInputValueOnSelectItems(
-        (forceClearInputValueOnSelectItems) => {
-          if (forceClearInputValueOnSelectItems.includes(item)) {
-            return forceClearInputValueOnSelectItems;
-          } else {
-            return [...forceClearInputValueOnSelectItems, item];
-          }
-        }
-      );
-    }
-    return () => {
-      setForceClearInputValueOnSelectItems(
-        (forceClearInputValueOnSelectItems) => {
-          if (forceClearInputValueOnSelectItems.includes(item)) {
-            return forceClearInputValueOnSelectItems.filter(
-              (prevItem) => prevItem !== item
-            );
-          } else {
-            return forceClearInputValueOnSelectItems;
-          }
-        }
-      );
-    };
-  }, [
-    item,
-    forceClearInputValueOnSelect,
-    setForceClearInputValueOnSelectItems
-  ]);
-  const flexProps = {
-    alignItems,
-    justifyItems,
-    alignContent,
-    justifyContent,
-    placeItems,
-    placeContent,
-    gap,
-    rowGap,
-    columnGap
-  };
-  if (multiple) {
-    const checked = selectedItems.some(
-      (selectedItem2) => itemToKey(selectedItem2) === itemToKey(item)
-    );
-    return /* @__PURE__ */ jsx(
-      ComboboxItemVisual,
-      {
-        rootDivProps: getItemProps({
-          item,
-          index,
-          "aria-selected": highlightedIndex === index,
-          ...rest
-        }),
-        disabled,
-        checked,
-        hideCheckbox: hideCheckbox || item === ADD_NEW$1,
-        flexProps,
-        children
-      }
-    );
-  } else {
-    return /* @__PURE__ */ jsxs(
-      "li",
-      {
-        ...getItemProps({
-          item,
-          index,
-          "aria-selected": highlightedIndex === index,
-          ...rest
-        }),
-        "data-anv": "combobox-item",
-        "data-checked": itemToKey(selectedItem) === itemToKey(item),
-        className: styles["item"],
-        ...disabled ? { "aria-disabled": true } : {},
-        children: [
-          /* @__PURE__ */ jsx(
-            Flex,
-            {
-              className: listboxStyles["children"],
-              grow: 1,
-              shrink: 1,
-              ...flexProps,
-              children
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            Icon$2,
-            {
-              "aria-hidden": true,
-              svg: SvgCheck,
-              inherit: true,
-              className: styles["Icon"],
-              style: {
-                opacity: itemToKey(selectedItem) === itemToKey(item) ? 1 : 0
-              }
-            }
-          )
-        ]
-      }
-    );
-  }
-};
-const ComboboxItemElement = function(props) {
-  if (!supportsPopover()) return /* @__PURE__ */ jsx(ComboboxLegacyItem, { ...props });
-  return /* @__PURE__ */ jsx(CoreComboboxItemElement, { ...props });
-};
-const ComboboxItem = function(props) {
-  const data = {
-    item: props.item
-  };
-  const trackingId = useTrackingId({
-    name: "ComboboxItem",
-    data,
-    hasOverride: !!props["data-tracking-id"]
-  });
-  return /* @__PURE__ */ jsx(ComboboxItemElement, { "data-tracking-id": trackingId, ...props });
-};
-const CoreComboboxItemAddNewElement = function({
-  onSelection,
-  ...props
-}) {
-  const { items, setHasAddNew, hasExactMatch, setOnSelectItemAddNew } = useCombobox$1();
-  useEffect(() => {
-    setHasAddNew?.(true);
-    return () => {
-      setHasAddNew?.(false);
-    };
-  }, []);
-  useEffect(() => {
-    setOnSelectItemAddNew?.(() => onSelection);
-    return () => {
-      setOnSelectItemAddNew?.(void 0);
-    };
-  }, [setOnSelectItemAddNew, onSelection]);
-  const firstRenderRef = useRef(true);
-  useEffect(() => {
-    if (firstRenderRef.current === true) {
-      firstRenderRef.current = false;
-    }
-  }, []);
-  return !hasExactMatch && !firstRenderRef.current ? /* @__PURE__ */ jsx(
-    ComboboxItem,
-    {
-      ...props,
-      item: ADD_NEW$1,
-      index: items.length
-    }
-  ) : null;
-};
-const ComboboxItemAddNewElement = function(props) {
-  if (!supportsPopover()) return /* @__PURE__ */ jsx(ComboboxLegacyItemAddNew, { ...props });
-  return /* @__PURE__ */ jsx(CoreComboboxItemAddNewElement, { ...props });
-};
-const ComboboxItemAddNew = function(props) {
-  const data = {
-    item: "add-new"
-  };
-  const trackingId = useTrackingId({
-    name: "ComboboxItemAddNew",
-    data,
-    hasOverride: !!props["data-tracking-id"]
-  });
-  return /* @__PURE__ */ jsx(ComboboxItemAddNewElement, { "data-tracking-id": trackingId, ...props });
-};
-
-const ComboboxListElement = function({
-  children,
-  ...rest
-}) {
-  const {
-    getMenuProps,
-    multiple,
-    items,
-    hasAddNew = false,
-    hasEmpty,
-    loading,
-    selectAll,
-    listRef
-  } = useCombobox$1();
-  const scrollSentinelRef = useRef(null);
-  const [isScrolled, setIsScrolled] = useState(false);
-  const { key: groupKey } = useComboboxGroupContext() ?? {};
-  const isAGroup = !!groupKey;
-  useEffect(() => {
-    if (!scrollSentinelRef.current) return;
-    const intersectionObserver = new IntersectionObserver(
-      (entries) => {
-        entries.forEach((entry) => {
-          if (!entry.isIntersecting) {
-            setIsScrolled(true);
-          } else {
-            setIsScrolled(false);
-          }
-        });
-      },
-      { threshold: 0 }
-    );
-    intersectionObserver.observe(scrollSentinelRef.current);
-    return () => {
-      intersectionObserver.disconnect();
-    };
-  }, [scrollSentinelRef, setIsScrolled]);
-  if (!supportsPopover())
-    return /* @__PURE__ */ jsx(ComboboxLegacyList, { ...rest, children });
-  if (isAGroup) {
-    return /* @__PURE__ */ jsx(Fragment, { children });
-  }
-  if (multiple) {
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsxs(
-        "ul",
-        {
-          ...getMenuProps(rest),
-          ref: listRef,
-          "data-anv": "combobox-list",
-          className: cx(styles["listview"], listViewStyles["listview"], {
-            [styles.scrolled]: isScrolled
-          }),
-          style: {
-            display: items.length || hasAddNew ? void 0 : "none"
-          },
-          children: [
-            /* @__PURE__ */ jsx("div", { ref: scrollSentinelRef, className: styles["scroll-sentinel"] }),
-            !loading && selectAll && /* @__PURE__ */ jsx(ComboboxSelectAll, {}),
-            children
-          ]
-        }
-      ),
-      loading ? /* @__PURE__ */ jsx("div", { className: styles["empty"], children: /* @__PURE__ */ jsx(Flex, { justifyContent: "center", children: /* @__PURE__ */ jsx(Spinner, { size: "small" }) }) }) : !items.length && !hasEmpty ? /* @__PURE__ */ jsx("div", { className: styles["empty"], children: /* @__PURE__ */ jsx(Text, { subdued: true, size: "small", children: "No match found" }) }) : null
-    ] });
-  } else {
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(
-        "ul",
-        {
-          ...getMenuProps(rest),
-          ref: listRef,
-          "data-anv": "combobox-list",
-          className: listboxStyles["listbox"],
-          style: {
-            display: items.length || hasAddNew ? void 0 : "none"
-          },
-          children
-        }
-      ),
-      loading ? /* @__PURE__ */ jsx("div", { className: styles["empty"], children: /* @__PURE__ */ jsx(Flex, { justifyContent: "center", children: /* @__PURE__ */ jsx(Spinner, { size: "small" }) }) }) : !items.length && !hasEmpty ? /* @__PURE__ */ jsx("div", { className: styles["empty"], children: /* @__PURE__ */ jsx(Text, { subdued: true, size: "small", children: "No match found" }) }) : null
-    ] });
-  }
-};
-const ComboboxList = function({
-  children,
-  className,
-  ...rest
-}) {
-  if (!supportsPopover())
-    return /* @__PURE__ */ jsx(ComboboxLegacyList, { className, ...rest, children });
-  return /* @__PURE__ */ jsx(ComboboxListElement, { className, ...rest, children });
-};
-
-const ComboboxSingle = function(props) {
-  const { layoutStyles, componentProps } = useLayoutPropsUtil(props);
-  const {
-    className,
-    style,
-    children,
-    open,
-    disabled,
-    readOnly,
-    items: itemsProp,
-    itemToString: itemToStringProp,
-    itemToKey: itemToKeyProp,
-    onChange,
-    disableCloseOnClickOutside = false,
-    disableMatchReferenceWidth = false,
-    disableCloseOnSelectItem = false,
-    filterOptions,
-    disableFilter = false,
-    loading = false,
-    minPopoverHeight,
-    root,
-    onInputValueChange,
-    environment: environmentProp,
-    groupBy,
-    groupToString,
-    groupSorter,
-    ...rest
-  } = componentProps;
-  const ComboboxClassNames = cx(styles["combobox"], className);
-  const [items, setItems] = useState(itemsProp);
-  const [hasAddNew, setHasAddNew] = useState(false);
-  const [onSelectItemAddNew, setOnSelectItemAddNew] = useState(void 0);
-  const [hasExactMatch, setHasExactMatch] = useState(false);
-  const [hasDisabledPopover, setHasDisabledPopover] = useState(false);
-  const [hasEmpty, setHasEmpty] = useState(false);
-  const [disabledItems, setDisabledItems] = useState([]);
-  const [forceCloseOnSelectItems, setForceCloseOnSelectItems] = useState([]);
-  const [, setForceClearInputValueOnSelectItems] = useState([]);
-  const [isReadOnly, setIsReadOnly] = useState(readOnly);
-  const [isDisabled, setIsDisabled] = useState(disabled);
-  const referenceRef = useRef(null);
-  const contentRef = useRef(null);
-  const listRef = useRef(null);
-  const handleOutsidePress = (_e) => {
-    if (disableCloseOnClickOutside) return;
-    closeMenu();
-  };
-  const { ref: wrapperDivRef, environment } = useDownshiftEnvironment$1();
-  const { orderedItems: allItemsOrderedByGroup } = useGroups({
-    items: itemsProp,
-    groupBy,
-    groupToString,
-    groupSorter
-  });
-  const { groups: searchedGroups, orderedItems: searchedItemsOrderedByGroup } = useGroups({
-    items,
-    groupBy,
-    groupToString,
-    groupSorter
-  });
-  const showAddNew = hasAddNew && !hasExactMatch;
-  const combinedItems = useMemo(
-    () => showAddNew ? [...searchedItemsOrderedByGroup, ADD_NEW$1] : searchedItemsOrderedByGroup,
-    [searchedItemsOrderedByGroup, showAddNew]
-  );
-  const itemToString = itemToStringProp ?? defaultItemToString$1;
-  const itemToKey = itemToKeyProp ?? defaultItemToKey$1;
-  const {
-    isOpen,
-    getLabelProps,
-    getInputProps,
-    getToggleButtonProps,
-    getMenuProps,
-    getItemProps,
-    highlightedIndex,
-    selectedItem,
-    selectItem,
-    setInputValue,
-    inputValue,
-    closeMenu
-  } = useCombobox({
-    ...rest,
-    items: combinedItems,
-    itemToString,
-    itemToKey,
-    isOpen: open,
-    initialIsOpen: open,
-    environment: environmentProp ?? environment,
-    // NOTE: Reducer needs to be pure, side-effects should be in event handlers
-    stateReducer(state, { type, changes }) {
-      switch (type) {
-        // keep Combobox open onBlur, will call close using Popover's onOutsidePress
-        case useCombobox.stateChangeTypes.InputBlur:
-          return {
-            ...changes,
-            isOpen: open != null ? open : true,
-            highlightedIndex: state.highlightedIndex
-          };
-        case useCombobox.stateChangeTypes.InputKeyDownEnter:
-        case useCombobox.stateChangeTypes.ItemClick:
-          if (changes.selectedItem === ADD_NEW$1) {
-            const stateInputValue = state.inputValue;
-            setTimeout(() => {
-              onSelectItemAddNew?.(stateInputValue);
-            }, 250);
-            return {
-              ...changes,
-              selectedItem: state.selectedItem,
-              inputValue: ""
-            };
-          } else {
-            const forceClose = forceCloseOnSelectItems.includes(
-              changes.selectedItem
-            );
-            return {
-              ...changes,
-              isOpen: open != null ? open : forceClose ? false : disableCloseOnSelectItem ? true : changes.isOpen,
-              highlightedIndex: disableCloseOnSelectItem ? itemToString(state.selectedItem) === state.inputValue || !state.inputValue ? state.highlightedIndex : 0 : changes.highlightedIndex
-            };
-          }
-        // prevent this from closing the popover by default
-        case useCombobox.stateChangeTypes.InputClick:
-          return { ...changes, isOpen: open != null ? open : true };
-        default:
-          return changes;
-      }
-    },
-    onInputValueChange: onInputValueChange ?? (({ inputValue: inputValue2, type, selectedItem: selectedItem2 }) => {
-      const inputValueMatchesSelectedItem = selectedItem2 != null && inputValue2 === itemToString(selectedItem2);
-      const inputValueIsEmpty = inputValue2 == null || inputValue2 === "";
-      if (type === useCombobox.stateChangeTypes.InputKeyDownEnter || type === useCombobox.stateChangeTypes.ItemClick) {
-        setItems(allItemsOrderedByGroup);
-        setHasExactMatch(true);
-      } else if (!inputValueMatchesSelectedItem && !inputValueIsEmpty && !disableFilter) {
-        setItems(
-          matchSorter(allItemsOrderedByGroup, inputValue2, filterOptions)
-        );
-        setHasExactMatch(
-          matchSorter(allItemsOrderedByGroup, inputValue2, {
-            ...filterOptions,
-            threshold: matchSorter.rankings.EQUAL
-          }).length > 0
-        );
-      } else {
-        setItems(allItemsOrderedByGroup);
-        setHasExactMatch(true);
-      }
-    }),
-    onSelectedItemChange(changes) {
-      const { selectedItem: selectedItem2 } = changes;
-      if (onChange != null)
-        onChange(selectedItem2 != null ? selectedItem2 : null);
-    },
-    onIsOpenChange({ isOpen: isOpen2, inputValue: inputValue2, selectedItem: selectedItem2 }) {
-      if (isOpen2 === false) {
-        setTimeout(() => {
-          setItems(allItemsOrderedByGroup);
-          if (inputValue2 === "") {
-            selectItem(null);
-          } else {
-            setInputValue(
-              selectedItem2 != null ? itemToString(selectedItem2) : ""
-            );
-          }
-        }, 200);
-      }
-    },
-    isItemDisabled(item) {
-      if (isDisabled || isReadOnly) {
-        return !!isDisabled || !!isReadOnly;
-      }
-      if (item && item instanceof Object && "disabled" in item && item.disabled) {
-        return true;
-      }
-      if (item && item instanceof Object && "readOnly" in item && item.readOnly) {
-        return true;
-      }
-      if (disabledItems.includes(item)) {
-        return true;
-      }
-      return false;
-    }
-  });
-  const firstRenderRef = useRef(true);
-  useEffect(() => {
-    if (firstRenderRef.current === true) {
-      firstRenderRef.current = false;
-    }
-  }, []);
-  useEffect(() => {
-    setIsDisabled(disabled);
-  }, [disabled]);
-  useEffect(() => {
-    setIsReadOnly(readOnly);
-  }, [readOnly]);
-  useEffect(() => {
-    if (firstRenderRef.current) return;
-    setTimeout(() => {
-      const inputValueMatchesSelectedItem = selectedItem != null && inputValue === itemToString(selectedItem);
-      const inputValueIsEmpty = inputValue == null || inputValue === "";
-      if (!inputValueMatchesSelectedItem && !inputValueIsEmpty && !disableFilter) {
-        setItems(
-          matchSorter(allItemsOrderedByGroup, inputValue, filterOptions)
-        );
-        setHasExactMatch(
-          matchSorter(allItemsOrderedByGroup, inputValue, {
-            ...filterOptions,
-            threshold: matchSorter.rankings.EQUAL
-          }).length > 0
-        );
-      } else {
-        setItems(allItemsOrderedByGroup);
-        setHasExactMatch(true);
-      }
-    }, 200);
-  }, [allItemsOrderedByGroup]);
-  return /* @__PURE__ */ jsx(
-    ComboboxContext.Provider,
-    {
-      value: {
-        multiple: false,
-        select: false,
-        items: searchedItemsOrderedByGroup,
-        itemToString,
-        itemToKey,
-        isOpen,
-        getLabelProps,
-        getInputProps,
-        getToggleButtonProps,
-        getMenuProps,
-        getItemProps,
-        highlightedIndex,
-        selectedItem,
-        selectedItems: [],
-        disabledItems,
-        setDisabledItems,
-        setForceCloseOnSelectItems,
-        setForceClearInputValueOnSelectItems,
-        getSelectedItemProps: void 0,
-        getDropdownProps: void 0,
-        selectItem,
-        inputValue,
-        isDisabled,
-        isReadOnly,
-        setIsReadOnly,
-        setIsDisabled,
-        hasDisabledPopover,
-        setHasDisabledPopover,
-        hasEmpty,
-        setHasEmpty,
-        hasAddNew,
-        setHasAddNew,
-        onSelectItemAddNew,
-        setOnSelectItemAddNew,
-        hasExactMatch,
-        setHasExactMatch,
-        loading,
-        referenceRef,
-        contentRef,
-        listRef,
-        closeMenu,
-        groupBy,
-        groupToString,
-        groups: searchedGroups
-      },
-      children: /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: ComboboxClassNames,
-          "data-anv": "combobox",
-          style: { ...style, ...layoutStyles },
-          ref: wrapperDivRef,
-          children: /* @__PURE__ */ jsx(
-            Popover,
-            {
-              open: isOpen,
-              noPadding: true,
-              disableCaret: true,
-              fitScreen: true,
-              disableFlipFallback: true,
-              placement: "bottom-start",
-              matchReferenceWidth: !disableMatchReferenceWidth,
-              disableCloseOnClickOutside,
-              onOutsidePress: handleOutsidePress,
-              minHeight: minPopoverHeight,
-              children
-            }
-          )
-        }
-      )
-    }
-  );
-};
-const ComboboxMultiple = function(props) {
-  const { layoutStyles, componentProps } = useLayoutPropsUtil(props);
-  const {
-    className,
-    style,
-    children,
-    open,
-    items: itemsProp,
-    itemToString: itemToStringProp,
-    itemToKey: itemToKeyProp,
-    onChange,
-    onSelectedItemsChange,
-    onStateChange,
-    disableCloseOnClickOutside = false,
-    disableMatchReferenceWidth = false,
-    disableCloseOnSelectItem = false,
-    disableClearInputValueOnSelectItem = false,
-    filterOptions,
-    disableFilter = false,
-    loading = false,
-    minPopoverHeight,
-    root,
-    disabled,
-    readOnly,
-    stateReducer: _,
-    onInputValueChange,
-    initialSelectedItems,
-    initialActiveIndex,
-    defaultSelectedItems,
-    defaultActiveIndex,
-    activeIndex: activeIndexProp,
-    selectedItems: selectedItemsProp,
-    environment: environmentProp,
-    selectAll,
-    groupBy,
-    groupToString,
-    ...rest
-  } = componentProps;
-  const ComboboxClassNames = cx(styles["combobox"], className);
-  const [items, setItems] = useState(itemsProp);
-  const [hasAddNew, setHasAddNew] = useState(false);
-  const [onSelectItemAddNew, setOnSelectItemAddNew] = useState(void 0);
-  const [hasExactMatch, setHasExactMatch] = useState(false);
-  const [hasDisabledPopover, setHasDisabledPopover] = useState(false);
-  const [hasEmpty, setHasEmpty] = useState(false);
-  const [disabledItems, setDisabledItems] = useState([]);
-  const [forceCloseOnSelectItems, setForceCloseOnSelectItems] = useState([]);
-  const [
-    forceClearInputValueOnSelectItems,
-    setForceClearInputValueOnSelectItems
-  ] = useState([]);
-  const [isReadOnly, setIsReadOnly] = useState(readOnly);
-  const [isDisabled, setIsDisabled] = useState(disabled);
-  let storedSetInputValue = void 0;
-  const referenceRef = useRef(null);
-  const contentRef = useRef(null);
-  const listRef = useRef(null);
-  const handleOutsidePress = (_e) => {
-    if (disableCloseOnClickOutside) return;
-    closeMenu();
-  };
-  const { ref: wrapperDivRef, environment } = useDownshiftEnvironment$1();
-  const { orderedItems: allItemsOrderedByGroup } = useGroups({
-    items: itemsProp,
-    groupBy,
-    groupToString
-  });
-  const { groups: searchedGroups, orderedItems: searchedItemsOrderedByGroup } = useGroups({
-    items,
-    groupBy,
-    groupToString
-  });
-  const showAddNew = hasAddNew && !hasExactMatch;
-  const combinedItems = useMemo(() => {
-    let items2 = searchedItemsOrderedByGroup;
-    if (showAddNew) {
-      items2 = [...items2, ADD_NEW$1];
-    }
-    if (selectAll) {
-      items2 = [SELECT_ALL, ...items2];
-    }
-    return items2;
-  }, [searchedItemsOrderedByGroup, showAddNew, selectAll]);
-  const itemToString = itemToStringProp ?? defaultItemToString$1;
-  const itemToKey = itemToKeyProp ?? defaultItemToKey$1;
-  const {
-    getSelectedItemProps,
-    getDropdownProps,
-    reset,
-    selectedItems,
-    addSelectedItem,
-    removeSelectedItem,
-    setSelectedItems
-  } = useMultipleSelection({
-    itemToKey,
-    initialSelectedItems,
-    initialActiveIndex,
-    defaultSelectedItems,
-    defaultActiveIndex,
-    activeIndex: activeIndexProp,
-    selectedItems: selectedItemsProp,
-    environment: environmentProp ?? environment,
-    stateReducer(state, { type, changes }) {
-      switch (type) {
-        // the Chip itself will handle "Backspace" and "Delete"
-        // just return previous state
-        case useMultipleSelection.stateChangeTypes.SelectedItemKeyDownBackspace:
-        case useMultipleSelection.stateChangeTypes.SelectedItemKeyDownDelete:
-          return state;
-        case useMultipleSelection.stateChangeTypes.FunctionRemoveSelectedItem:
-          return { ...changes, activeIndex: -1 };
-        case useMultipleSelection.stateChangeTypes.FunctionReset:
-          return { ...changes, selectedItems: [] };
-        default:
-          return changes;
-      }
-    },
-    onStateChange(changes) {
-      const { type } = changes;
-      switch (type) {
-        case useMultipleSelection.stateChangeTypes.FunctionReset:
-          storedSetInputValue?.("");
-          break;
-      }
-      onStateChange?.(changes);
-    },
-    onSelectedItemsChange(changes) {
-      const { selectedItems: selectedItems2 } = changes;
-      if (onChange != null) onChange(selectedItems2);
-      if (onSelectedItemsChange != null) onSelectedItemsChange(changes);
-    }
-  });
-  const {
-    isOpen,
-    getLabelProps,
-    getInputProps,
-    getToggleButtonProps,
-    getMenuProps,
-    getItemProps,
-    highlightedIndex,
-    selectedItem,
-    selectItem,
-    setInputValue,
-    inputValue,
-    closeMenu
-  } = useCombobox({
-    ...rest,
-    items: combinedItems,
-    itemToString,
-    itemToKey,
-    selectedItem: null,
-    isOpen: open,
-    initialIsOpen: open,
-    environment: environmentProp ?? environment,
-    // NOTE: Reducer needs to be pure, side-effects should be in event handlers
-    stateReducer(state, { type, changes }) {
-      switch (type) {
-        // keep Combobox open onBlur, will call close using Popover's onOutsidePress
-        case useCombobox.stateChangeTypes.InputBlur:
-          return {
-            ...changes,
-            inputValue: state.inputValue,
-            selectedItem: null,
-            isOpen: open != null ? open : true,
-            highlightedIndex: state.highlightedIndex
-          };
-        case useCombobox.stateChangeTypes.InputKeyDownEnter:
-        case useCombobox.stateChangeTypes.ItemClick:
-          if (changes.selectedItem === ADD_NEW$1) {
-            const stateInputValue = state.inputValue;
-            setTimeout(() => {
-              onSelectItemAddNew?.(stateInputValue);
-            }, 250);
-            return {
-              ...changes,
-              selectedItem: state.selectedItem,
-              inputValue: ""
-            };
-          } else if (changes.selectedItem === SELECT_ALL) {
-            selectAll?.onSelection();
-            return {
-              ...changes,
-              selectedItem: null
-            };
-          } else {
-            const forceClose = forceCloseOnSelectItems.includes(
-              changes.selectedItem
-            );
-            const forceClearInputValue = forceClearInputValueOnSelectItems.includes(
-              changes.selectedItem
-            );
-            return {
-              ...changes,
-              isOpen: open != null ? open : forceClose ? false : disableCloseOnSelectItem ? true : changes.isOpen,
-              highlightedIndex: forceClearInputValue ? 0 : disableCloseOnSelectItem ? disableClearInputValueOnSelectItem || !state.inputValue ? state.highlightedIndex : 0 : changes.highlightedIndex,
-              inputValue: forceClearInputValue ? "" : disableClearInputValueOnSelectItem ? state.inputValue : ""
-            };
-          }
-        // prevent this from closing the popover by default
-        case useCombobox.stateChangeTypes.InputClick:
-          return { ...changes, isOpen: open != null ? open : true };
-        // prevent this from clearing the input value by default
-        case useCombobox.stateChangeTypes.ControlledPropUpdatedSelectedItem:
-          return { ...changes, inputValue: state.inputValue };
-        default:
-          return changes;
-      }
-    },
-    onStateChange(changes) {
-      const { type, selectedItem: newSelectedItem } = changes;
-      switch (type) {
-        case useCombobox.stateChangeTypes.InputKeyDownEnter:
-        case useCombobox.stateChangeTypes.ItemClick:
-        case useCombobox.stateChangeTypes.InputBlur:
-          if (newSelectedItem != null) {
-            const itemAlreadySelected = selectedItems.some(
-              (item) => itemToKey(item) === itemToKey(newSelectedItem)
-            );
-            if (itemAlreadySelected) {
-              removeSelectedItem(newSelectedItem);
-            } else {
-              addSelectedItem(newSelectedItem);
-            }
-          }
-          break;
-      }
-      onStateChange?.(changes);
-    },
-    onInputValueChange: onInputValueChange ?? (({ inputValue: inputValue2, ...changes }) => {
-      const { type, selectedItem: selectedItem2 } = changes;
-      const inputValueMatchesSelectedItem = selectedItem2 != null && inputValue2 === itemToString(selectedItem2);
-      const inputValueIsEmpty = inputValue2 == null || inputValue2 === "";
-      if (type === useCombobox.stateChangeTypes.InputKeyDownEnter || type === useCombobox.stateChangeTypes.ItemClick) {
-        setItems(allItemsOrderedByGroup);
-        setHasExactMatch(true);
-      } else if (!inputValueMatchesSelectedItem && !inputValueIsEmpty && !disableFilter) {
-        setItems(
-          matchSorter(allItemsOrderedByGroup, inputValue2, filterOptions)
-        );
-        setHasExactMatch(
-          matchSorter(allItemsOrderedByGroup, inputValue2, {
-            ...filterOptions,
-            threshold: matchSorter.rankings.EQUAL
-          }).length > 0
-        );
-      } else {
-        setItems(allItemsOrderedByGroup);
-        setHasExactMatch(true);
-      }
-    }),
-    onIsOpenChange({ isOpen: isOpen2 }) {
-      if (isOpen2 === false) {
-        setTimeout(() => {
-          setInputValue("");
-          setItems(allItemsOrderedByGroup);
-        }, 200);
-      }
-    },
-    isItemDisabled(item) {
-      if (isDisabled || isReadOnly) {
-        return !!isDisabled || !!isReadOnly;
-      }
-      if (item && item instanceof Object && "disabled" in item && item.disabled) {
-        return true;
-      }
-      if (item && item instanceof Object && "readOnly" in item && item.readOnly) {
-        return true;
-      }
-      if (disabledItems.includes(item)) {
-        return true;
-      }
-      return false;
-    },
-    onHighlightedIndexChange(changes) {
-      if (selectAll && changes.highlightedIndex === 0 && [
-        useCombobox.stateChangeTypes.InputKeyDownHome,
-        useCombobox.stateChangeTypes.InputKeyDownEnd,
-        useCombobox.stateChangeTypes.InputKeyDownArrowDown,
-        useCombobox.stateChangeTypes.InputKeyDownArrowUp,
-        useCombobox.stateChangeTypes.InputKeyDownPageDown,
-        useCombobox.stateChangeTypes.InputKeyDownPageUp
-      ].includes(changes.type) && listRef.current) {
-        const scrollParent = getScrollParent(listRef.current);
-        if (scrollParent) {
-          scrollParent.scrollTop = 0;
-        }
-      }
-    }
-  });
-  storedSetInputValue = setInputValue;
-  const firstRenderRef = useRef(true);
-  useEffect(() => {
-    if (firstRenderRef.current === true) {
-      firstRenderRef.current = false;
-    }
-  }, []);
-  useEffect(() => {
-    setIsDisabled(disabled);
-  }, [disabled]);
-  useEffect(() => {
-    setIsReadOnly(readOnly);
-  }, [readOnly]);
-  useEffect(() => {
-    if (firstRenderRef.current) return;
-    setTimeout(() => {
-      const inputValueIsEmpty = inputValue == null || inputValue === "";
-      if (!inputValueIsEmpty && !disableFilter) {
-        setItems(matchSorter(itemsProp, inputValue, filterOptions));
-        setHasExactMatch(
-          matchSorter(itemsProp, inputValue, {
-            ...filterOptions,
-            threshold: matchSorter.rankings.EQUAL
-          }).length > 0
-        );
-      } else {
-        setItems(itemsProp);
-        setHasExactMatch(true);
-      }
-    }, 200);
-  }, [itemsProp]);
-  return /* @__PURE__ */ jsx(
-    ComboboxContext.Provider,
-    {
-      value: {
-        multiple: true,
-        select: false,
-        items: combinedItems,
-        itemToString,
-        itemToKey,
-        isOpen,
-        getLabelProps,
-        getInputProps,
-        getToggleButtonProps,
-        getMenuProps,
-        getItemProps,
-        highlightedIndex,
-        selectedItem,
-        selectedItems,
-        disabledItems,
-        setDisabledItems,
-        setForceCloseOnSelectItems,
-        setForceClearInputValueOnSelectItems,
-        getSelectedItemProps,
-        getDropdownProps,
-        reset,
-        addSelectedItem,
-        removeSelectedItem,
-        setSelectedItems,
-        selectItem,
-        inputValue,
-        isDisabled,
-        isReadOnly,
-        setIsReadOnly,
-        setIsDisabled,
-        hasDisabledPopover,
-        setHasDisabledPopover,
-        hasEmpty,
-        setHasEmpty,
-        hasAddNew,
-        setHasAddNew,
-        onSelectItemAddNew,
-        setOnSelectItemAddNew,
-        hasExactMatch,
-        setHasExactMatch,
-        loading,
-        referenceRef,
-        contentRef,
-        listRef,
-        closeMenu,
-        groupBy,
-        groupToString,
-        groups: searchedGroups,
-        selectAll
-      },
-      children: /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: ComboboxClassNames,
-          "data-anv": "combobox",
-          style: { ...style, ...layoutStyles },
-          ref: wrapperDivRef,
-          children: /* @__PURE__ */ jsx(
-            Popover,
-            {
-              open: !isDisabled && isOpen,
-              noPadding: true,
-              disableCaret: true,
-              fitScreen: true,
-              disableFlipFallback: true,
-              placement: "bottom-start",
-              matchReferenceWidth: !disableMatchReferenceWidth,
-              disableCloseOnClickOutside,
-              onOutsidePress: handleOutsidePress,
-              minHeight: minPopoverHeight,
-              children
-            }
-          )
-        }
-      )
-    }
-  );
-};
-const ComboboxElement = function(props) {
-  if (!supportsPopover()) {
-    if (isMultiple(props)) {
-      return /* @__PURE__ */ jsx(ComboboxLegacyMultiple, { ...props });
-    } else {
-      return /* @__PURE__ */ jsx(ComboboxLegacySingle, { ...props });
-    }
-  }
-  if (isMultiple(props)) {
-    return /* @__PURE__ */ jsx(ComboboxMultiple, { ...props });
-  } else {
-    return /* @__PURE__ */ jsx(ComboboxSingle, { ...props });
-  }
-};
-const Combobox = Object.assign(ComboboxElement, {
-  /**
-   * ComboboxSelect component for selecting items from a predefined list.
-   *
-   * Features:
-   * - Single and multiple item selection from predefined options
-   * - Dropdown-style selection interface
-   * - Grouping support with custom group labels and sorting
-   * - Loading states with spinner indicators
-   * - Disabled and read-only states
-   * - Customizable popover behavior and positioning
-   * - Full accessibility support with ARIA attributes
-   * - Keyboard navigation support
-   * - Layout utility props for positioning and spacing
-   * - Automatic tracking ID generation for analytics
-   *
-   * @example
-   * <Combobox.Select
-   *   items={items}
-   *   itemToString={(item) => item.name}
-   *   onChange={setSelectedItem}
-   * >
-   *   <Combobox.SelectTrigger label="Select an item" />
-   *   <Combobox.Content>
-   *     {({ items }) => (
-   *       <Combobox.List>
-   *         {items.map((item, i) => (
-   *           <Combobox.Item key={item.id} item={item} index={i}>
-   *             {item.name}
-   *           </Combobox.Item>
-   *         ))}
-   *       </Combobox.List>
-   *     )}
-   *   </Combobox.Content>
-   * </Combobox.Select>
-   */
-  Select: ComboboxSelect,
-  /**
-   * ComboboxSearchField component for the search input field.
-   *
-   * Features:
-   * - Search input with clear button functionality
-   * - Supports multiple selection with chip display
-   * - Handles keyboard navigation and accessibility
-   * - Integrates with combobox state management
-   * - Supports custom styling and layout
-   * - Manages focus and blur events
-   * - Enhanced prefix support for icons and avatars
-   * - Automatic tracking ID generation for analytics
-   *
-   * @example
-   * <Combobox.SearchField
-   *   label="Search users"
-   *   placeholder="Type to search..."
-   *   prefix={{ icon: { svg: SearchIcon } }}
-   * />
-   */
-  SearchField: ComboboxSearchField,
-  /**
-   * ComboboxSelectTrigger component for the select trigger field.
-   *
-   * Features:
-   * - Select input with dropdown trigger
-   * - Supports single selection display
-   * - Handles keyboard navigation and accessibility
-   * - Integrates with combobox state management
-   * - Supports custom styling and layout
-   * - Manages focus and blur events
-   * - Enhanced prefix support for icons and avatars
-   * - Automatic tracking ID generation for analytics
-   *
-   * @example
-   * <Combobox.SelectTrigger
-   *   label="Select user"
-   *   placeholder="Choose a user..."
-   *   prefix={{ avatar: { name: "User" } }}
-   * />
-   */
-  SelectTrigger: ComboboxSelectTrigger,
-  /**
-   * ComboboxContent component for rendering the content area of a combobox.
-   *
-   * Features:
-   * - Supports both popover and inline rendering modes
-   * - Provides render props pattern for flexible content rendering
-   * - Handles grouped items with proper ARIA labels
-   * - Integrates with combobox state management
-   * - Supports custom styling and layout
-   * - Manages focus and blur events for popover behavior
-   *
-   * @example
-   * <Combobox.Content>
-   *   {({ items }) => (
-   *     <Combobox.List>
-   *       {items.map((item, index) => (
-   *         <Combobox.Item key={item.id} item={item} index={index}>
-   *           {item.name}
-   *         </Combobox.Item>
-   *       ))}
-   *     </Combobox.List>
-   *   )}
-   * </Combobox.Content>
-   */
-  Content: ComboboxContent,
-  /**
-   * ComboboxList component for rendering the list of items.
-   *
-   * Features:
-   * - Renders list of items with proper accessibility
-   * - Supports both single and multiple selection modes
-   * - Loading state with spinner
-   * - Empty state handling
-   * - Automatic tracking ID generation for analytics
-   *
-   * @example
-   * <Combobox.List>
-   *   {items.map((item, i) => (
-   *     <Combobox.Item key={item.id} item={item} index={i}>
-   *       {item.name}
-   *     </Combobox.Item>
-   *   ))}
-   * </Combobox.List>
-   */
-  List: ComboboxList,
-  /**
-   * ComboboxItem component for rendering individual items in the list.
-   *
-   * Features:
-   * - Individual item rendering with proper accessibility
-   * - Support for disabled state
-   * - Custom content rendering
-   * - Automatic tracking ID generation for analytics
-   *
-   * @example
-   * <Combobox.Item item={item} index={index}>
-   *   <Flex direction="column">
-   *     <Text>{item.name}</Text>
-   *     <Text size="small" subdued>{item.description}</Text>
-   *   </Flex>
-   * </Combobox.Item>
-   */
-  Item: ComboboxItem,
-  /**
-   * ComboboxItemAddNew component for rendering an "Add New" option.
-   *
-   * Features:
-   * - "Add New" option that appears when no exact match is found
-   * - Customizable content rendering
-   * - Callback when selected
-   * - Automatic tracking ID generation for analytics
-   *
-   * @example
-   * <Combobox.ItemAddNew onSelection={(inputValue) => addNewItem(inputValue)}>
-   *   Add "{inputValue}" as new item
-   * </Combobox.ItemAddNew>
-   */
-  ItemAddNew: ComboboxItemAddNew,
-  /**
-   * ComboboxEmpty component for rendering content when no items are available.
-   *
-   * Features:
-   * - Renders content when list is empty
-   * - Customizable empty state message
-   * - Automatic tracking ID generation for analytics
-   *
-   * @example
-   * <Combobox.Empty>
-   *   <Text>No items found. Try adjusting your search.</Text>
-   * </Combobox.Empty>
-   */
-  Empty: ComboboxEmpty
-});
-
-export { Combobox as C, ComboboxElement as a, ComboboxSelect as b, ComboboxContent as c, ComboboxList as d, ComboboxItem as e, ComboboxItemAddNew as f, ComboboxSearchField as g, ComboboxSelectTrigger as h, ComboboxEmpty as i };
-//# sourceMappingURL=Combobox-RjBDpgFV.js.map
+export { useMultipleSelection as a, useSelect as b, matchSorter as m, useCombobox as u };
+//# sourceMappingURL=match-sorter.esm-CtBw0MrM.js.map