@fragments-sdk/ui 0.14.0 → 0.15.1

package/dist/node_modules/.pnpm/@base-ui_react@1.1.0_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/react/esm/combobox/root/AriaCombobox.js

@@ -1,979 +0,0 @@
-import * as React from "react";
-import { useControlled } from "../../../../../../../@base-ui_utils@0.2.4_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/utils/esm/useControlled.js";
-import { useIsoLayoutEffect } from "../../../../../../../@base-ui_utils@0.2.4_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/utils/esm/useIsoLayoutEffect.js";
-import { useOnFirstRender } from "../../../../../../../@base-ui_utils@0.2.4_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/utils/esm/useOnFirstRender.js";
-import { useStableCallback } from "../../../../../../../@base-ui_utils@0.2.4_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/utils/esm/useStableCallback.js";
-import { useMergedRefs } from "../../../../../../../@base-ui_utils@0.2.4_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/utils/esm/useMergedRefs.js";
-import { visuallyHiddenInput, visuallyHidden } from "../../../../../../../@base-ui_utils@0.2.4_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/utils/esm/visuallyHidden.js";
-import { useRefWithInit } from "../../../../../../../@base-ui_utils@0.2.4_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/utils/esm/useRefWithInit.js";
-import { useValueAsRef } from "../../../../../../../@base-ui_utils@0.2.4_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/utils/esm/useValueAsRef.js";
-import { createGenericEventDetails, createChangeEventDetails } from "../../utils/createBaseUIEventDetails.js";
-import { ComboboxRootContext, ComboboxFloatingContext, ComboboxDerivedItemsContext, ComboboxInputValueContext } from "./ComboboxRootContext.js";
-import { selectors } from "../store.js";
-import { useOpenChangeComplete } from "../../utils/useOpenChangeComplete.js";
-import { useFieldRootContext } from "../../field/root/FieldRootContext.js";
-import { useField } from "../../field/useField.js";
-import { useFormContext } from "../../form/FormContext.js";
-import { useLabelableId } from "../../labelable-provider/useLabelableId.js";
-import { createSingleSelectionCollatorFilter, createCollatorItemFilter } from "./utils/index.js";
-import { useCoreFilter } from "./utils/useFilter.js";
-import { useTransitionStatus } from "../../utils/useTransitionStatus.js";
-import { useOpenInteractionType } from "../../utils/useOpenInteractionType.js";
-import { useValueChanged } from "../../utils/useValueChanged.js";
-import { isGroupedItems, stringifyAsLabel, stringifyAsValue } from "../../utils/resolveValueLabel.js";
-import { defaultItemEquality, findItemIndex, itemIncludes, removeItem } from "../../utils/itemEquality.js";
-import { INITIAL_LAST_HIGHLIGHT, NO_ACTIVE_VALUE } from "./utils/constants.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { EMPTY_ARRAY, NOOP, EMPTY_OBJECT } from "../../../../../../../@base-ui_utils@0.2.4_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/utils/esm/empty.js";
-import { useStore } from "../../../../../../../@base-ui_utils@0.2.4_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/utils/esm/store/useStore.js";
-import { useFloatingRootContext } from "../../floating-ui-react/hooks/useFloatingRootContext.js";
-import { useClick } from "../../floating-ui-react/hooks/useClick.js";
-import { useDismiss } from "../../floating-ui-react/hooks/useDismiss.js";
-import { useListNavigation } from "../../floating-ui-react/hooks/useListNavigation.js";
-import { useInteractions } from "../../floating-ui-react/hooks/useInteractions.js";
-import { Store } from "../../../../../../../@base-ui_utils@0.2.4_@types_react@19.2.9_react-dom@19.2.3_react@19.2.3__react@19.2.3/node_modules/@base-ui/utils/esm/store/Store.js";
-import { inputChange, inputClear, none, focusOut, outsidePress, itemPress } from "../../utils/reason-parts.js";
-import { getTarget, contains } from "../../floating-ui-react/utils/element.js";
-function AriaCombobox(props) {
-  const {
-    id: idProp,
-    onOpenChangeComplete: onOpenChangeCompleteProp,
-    defaultSelectedValue = null,
-    selectedValue: selectedValueProp,
-    onSelectedValueChange,
-    defaultInputValue: defaultInputValueProp,
-    inputValue: inputValueProp,
-    selectionMode = "none",
-    onItemHighlighted: onItemHighlightedProp,
-    name: nameProp,
-    disabled: disabledProp = false,
-    readOnly = false,
-    required = false,
-    inputRef: inputRefProp,
-    grid = false,
-    items,
-    filteredItems: filteredItemsProp,
-    filter: filterProp,
-    openOnInputClick = true,
-    autoHighlight = false,
-    keepHighlight = false,
-    highlightItemOnHover = true,
-    loopFocus = true,
-    itemToStringLabel,
-    itemToStringValue,
-    isItemEqualToValue = defaultItemEquality,
-    virtualized = false,
-    inline: inlineProp = false,
-    fillInputOnItemPress = true,
-    modal = false,
-    limit = -1,
-    autoComplete = "list",
-    locale,
-    submitOnItemClick = false
-  } = props;
-  const {
-    clearErrors
-  } = useFormContext();
-  const {
-    setDirty,
-    validityData,
-    shouldValidateOnChange,
-    setFilled,
-    name: fieldName,
-    disabled: fieldDisabled,
-    setTouched,
-    setFocused,
-    validationMode,
-    validation
-  } = useFieldRootContext();
-  const id = useLabelableId({
-    id: idProp
-  });
-  const collatorFilter = useCoreFilter({
-    locale
-  });
-  const [queryChangedAfterOpen, setQueryChangedAfterOpen] = React.useState(false);
-  const [closeQuery, setCloseQuery] = React.useState(null);
-  const listRef = React.useRef([]);
-  const labelsRef = React.useRef([]);
-  const popupRef = React.useRef(null);
-  const inputRef = React.useRef(null);
-  const emptyRef = React.useRef(null);
-  const keyboardActiveRef = React.useRef(true);
-  const hadInputClearRef = React.useRef(false);
-  const chipsContainerRef = React.useRef(null);
-  const clearRef = React.useRef(null);
-  const selectionEventRef = React.useRef(null);
-  const lastHighlightRef = React.useRef(INITIAL_LAST_HIGHLIGHT);
-  const pendingQueryHighlightRef = React.useRef(null);
-  const valuesRef = React.useRef([]);
-  const allValuesRef = React.useRef([]);
-  const disabled = fieldDisabled || disabledProp;
-  const name = fieldName ?? nameProp;
-  const multiple = selectionMode === "multiple";
-  const single = selectionMode === "single";
-  const hasInputValue = inputValueProp !== void 0 || defaultInputValueProp !== void 0;
-  const hasItems = items !== void 0;
-  const hasFilteredItemsProp = filteredItemsProp !== void 0;
-  let autoHighlightMode;
-  if (autoHighlight === "always") {
-    autoHighlightMode = "always";
-  } else {
-    autoHighlightMode = autoHighlight ? "input-change" : false;
-  }
-  const [selectedValue, setSelectedValueUnwrapped] = useControlled({
-    controlled: selectedValueProp,
-    default: multiple ? defaultSelectedValue ?? EMPTY_ARRAY : defaultSelectedValue,
-    name: "Combobox",
-    state: "selectedValue"
-  });
-  const filter = React.useMemo(() => {
-    if (filterProp === null) {
-      return () => true;
-    }
-    if (filterProp !== void 0) {
-      return filterProp;
-    }
-    if (single && !queryChangedAfterOpen) {
-      return createSingleSelectionCollatorFilter(collatorFilter, itemToStringLabel, selectedValue);
-    }
-    return createCollatorItemFilter(collatorFilter, itemToStringLabel);
-  }, [filterProp, single, selectedValue, queryChangedAfterOpen, collatorFilter, itemToStringLabel]);
-  const initialDefaultInputValue = useRefWithInit(() => {
-    if (hasInputValue) {
-      return defaultInputValueProp ?? "";
-    }
-    if (single) {
-      return stringifyAsLabel(selectedValue, itemToStringLabel);
-    }
-    return "";
-  }).current;
-  const [inputValue, setInputValueUnwrapped] = useControlled({
-    controlled: inputValueProp,
-    default: initialDefaultInputValue,
-    name: "Combobox",
-    state: "inputValue"
-  });
-  const [open, setOpenUnwrapped] = useControlled({
-    controlled: props.open,
-    default: props.defaultOpen,
-    name: "Combobox",
-    state: "open"
-  });
-  const isGrouped = isGroupedItems(items);
-  const query = closeQuery ?? (inputValue === "" ? "" : String(inputValue).trim());
-  const selectedLabelString = single ? stringifyAsLabel(selectedValue, itemToStringLabel) : "";
-  const shouldBypassFiltering = single && !queryChangedAfterOpen && query !== "" && selectedLabelString !== "" && selectedLabelString.length === query.length && collatorFilter.contains(selectedLabelString, query);
-  const filterQuery = shouldBypassFiltering ? "" : query;
-  const shouldIgnoreExternalFiltering = hasItems && hasFilteredItemsProp && shouldBypassFiltering;
-  const flatItems = React.useMemo(() => {
-    if (!items) {
-      return EMPTY_ARRAY;
-    }
-    if (isGrouped) {
-      return items.flatMap((group) => group.items);
-    }
-    return items;
-  }, [items, isGrouped]);
-  const filteredItems = React.useMemo(() => {
-    if (filteredItemsProp && !shouldIgnoreExternalFiltering) {
-      return filteredItemsProp;
-    }
-    if (!items) {
-      return EMPTY_ARRAY;
-    }
-    if (isGrouped) {
-      const groupedItems = items;
-      const resultingGroups = [];
-      let currentCount = 0;
-      for (const group of groupedItems) {
-        if (limit > -1 && currentCount >= limit) {
-          break;
-        }
-        const candidateItems = filterQuery === "" ? group.items : group.items.filter((item) => filter(item, filterQuery, itemToStringLabel));
-        if (candidateItems.length === 0) {
-          continue;
-        }
-        const remainingLimit = limit > -1 ? limit - currentCount : Infinity;
-        const itemsToTake = candidateItems.slice(0, remainingLimit);
-        if (itemsToTake.length > 0) {
-          const newGroup = {
-            ...group,
-            items: itemsToTake
-          };
-          resultingGroups.push(newGroup);
-          currentCount += itemsToTake.length;
-        }
-      }
-      return resultingGroups;
-    }
-    if (filterQuery === "") {
-      return limit > -1 ? flatItems.slice(0, limit) : (
-        // The cast here is done as `flatItems` is readonly.
-        // valuesRef.current, a mutable ref, can be set to `flatFilteredItems`, which may
-        // reference this exact readonly value, creating a mutation risk.
-        // However, <Combobox.Item> can never mutate this value as the mutating effect
-        // bails early when `items` is provided, and this is only ever returned
-        // when `items` is provided due to the early return at the top of this hook.
-        flatItems
-      );
-    }
-    const limitedItems = [];
-    for (const item of flatItems) {
-      if (limit > -1 && limitedItems.length >= limit) {
-        break;
-      }
-      if (filter(item, filterQuery, itemToStringLabel)) {
-        limitedItems.push(item);
-      }
-    }
-    return limitedItems;
-  }, [filteredItemsProp, shouldIgnoreExternalFiltering, items, isGrouped, filterQuery, limit, filter, itemToStringLabel, flatItems]);
-  const flatFilteredItems = React.useMemo(() => {
-    if (isGrouped) {
-      const groups = filteredItems;
-      return groups.flatMap((g) => g.items);
-    }
-    return filteredItems;
-  }, [filteredItems, isGrouped]);
-  const store = useRefWithInit(() => new Store({
-    id,
-    selectedValue,
-    open,
-    filter,
-    query,
-    items,
-    selectionMode,
-    listRef,
-    labelsRef,
-    popupRef,
-    emptyRef,
-    inputRef,
-    keyboardActiveRef,
-    chipsContainerRef,
-    clearRef,
-    valuesRef,
-    allValuesRef,
-    selectionEventRef,
-    name,
-    disabled,
-    readOnly,
-    required,
-    grid,
-    isGrouped,
-    virtualized,
-    openOnInputClick,
-    itemToStringLabel,
-    isItemEqualToValue,
-    modal,
-    autoHighlight: autoHighlightMode,
-    submitOnItemClick,
-    hasInputValue,
-    mounted: false,
-    forceMounted: false,
-    transitionStatus: "idle",
-    inline: inlineProp,
-    activeIndex: null,
-    selectedIndex: null,
-    popupProps: {},
-    inputProps: {},
-    triggerProps: {},
-    positionerElement: null,
-    listElement: null,
-    triggerElement: null,
-    inputElement: null,
-    popupSide: null,
-    openMethod: null,
-    inputInsidePopup: true,
-    onOpenChangeComplete: onOpenChangeCompleteProp || NOOP,
-    // Placeholder callbacks replaced on first render
-    setOpen: NOOP,
-    setInputValue: NOOP,
-    setSelectedValue: NOOP,
-    setIndices: NOOP,
-    onItemHighlighted: NOOP,
-    handleSelection: NOOP,
-    getItemProps: () => EMPTY_OBJECT,
-    forceMount: NOOP,
-    requestSubmit: NOOP
-  })).current;
-  const fieldRawValue = selectionMode === "none" ? inputValue : selectedValue;
-  const fieldStringValue = React.useMemo(() => {
-    if (selectionMode === "none") {
-      return fieldRawValue;
-    }
-    if (Array.isArray(selectedValue)) {
-      return selectedValue.map((value) => stringifyAsValue(value, itemToStringValue));
-    }
-    return stringifyAsValue(selectedValue, itemToStringValue);
-  }, [fieldRawValue, itemToStringValue, selectionMode, selectedValue]);
-  const onItemHighlighted = useStableCallback(onItemHighlightedProp);
-  const onOpenChangeComplete = useStableCallback(onOpenChangeCompleteProp);
-  const activeIndex = useStore(store, selectors.activeIndex);
-  const selectedIndex = useStore(store, selectors.selectedIndex);
-  const positionerElement = useStore(store, selectors.positionerElement);
-  const listElement = useStore(store, selectors.listElement);
-  const triggerElement = useStore(store, selectors.triggerElement);
-  const inputElement = useStore(store, selectors.inputElement);
-  const inline = useStore(store, selectors.inline);
-  const inputInsidePopup = useStore(store, selectors.inputInsidePopup);
-  const triggerRef = useValueAsRef(triggerElement);
-  const {
-    mounted,
-    setMounted,
-    transitionStatus
-  } = useTransitionStatus(open);
-  const {
-    openMethod,
-    triggerProps,
-    reset: resetOpenInteractionType
-  } = useOpenInteractionType(open);
-  useField({
-    id,
-    name,
-    commit: validation.commit,
-    value: fieldRawValue,
-    controlRef: inputInsidePopup ? triggerRef : inputRef,
-    getValue: () => fieldStringValue
-  });
-  const forceMount = useStableCallback(() => {
-    if (items) {
-      labelsRef.current = flatFilteredItems.map((item) => stringifyAsLabel(item, itemToStringLabel));
-    } else {
-      store.set("forceMounted", true);
-    }
-  });
-  const initialSelectedValueRef = React.useRef(selectedValue);
-  useIsoLayoutEffect(() => {
-    if (selectedValue !== initialSelectedValueRef.current) {
-      forceMount();
-    }
-  }, [forceMount, selectedValue]);
-  const setIndices = useStableCallback((options) => {
-    store.update(options);
-    const type = options.type || "none";
-    if (options.activeIndex === void 0) {
-      return;
-    }
-    if (options.activeIndex === null) {
-      if (lastHighlightRef.current !== INITIAL_LAST_HIGHLIGHT) {
-        lastHighlightRef.current = INITIAL_LAST_HIGHLIGHT;
-        onItemHighlighted(void 0, createGenericEventDetails(type, void 0, {
-          index: -1
-        }));
-      }
-    } else {
-      const activeValue = valuesRef.current[options.activeIndex];
-      lastHighlightRef.current = {
-        value: activeValue,
-        index: options.activeIndex
-      };
-      onItemHighlighted(activeValue, createGenericEventDetails(type, void 0, {
-        index: options.activeIndex
-      }));
-    }
-  });
-  const setInputValue = useStableCallback((next, eventDetails) => {
-    var _a;
-    hadInputClearRef.current = eventDetails.reason === inputClear;
-    (_a = props.onInputValueChange) == null ? void 0 : _a.call(props, next, eventDetails);
-    if (eventDetails.isCanceled) {
-      return;
-    }
-    if (eventDetails.reason === inputChange) {
-      const hasQuery = next.trim() !== "";
-      if (hasQuery) {
-        setQueryChangedAfterOpen(true);
-      }
-      pendingQueryHighlightRef.current = {
-        hasQuery
-      };
-      if (hasQuery && autoHighlightMode && store.state.activeIndex == null) {
-        store.set("activeIndex", 0);
-      }
-    }
-    setInputValueUnwrapped(next);
-  });
-  const setOpen = useStableCallback((nextOpen, eventDetails) => {
-    var _a;
-    if (open === nextOpen) {
-      return;
-    }
-    if (eventDetails.reason === "escape-key" && hasItems && flatFilteredItems.length === 0 && !store.state.emptyRef.current) {
-      eventDetails.allowPropagation();
-    }
-    (_a = props.onOpenChange) == null ? void 0 : _a.call(props, nextOpen, eventDetails);
-    if (eventDetails.isCanceled) {
-      return;
-    }
-    if (!nextOpen && queryChangedAfterOpen) {
-      if (single) {
-        setCloseQuery(query);
-        if (query === "") {
-          setQueryChangedAfterOpen(false);
-        }
-      } else if (multiple) {
-        if (inline || inputInsidePopup) {
-          setIndices({
-            activeIndex: null
-          });
-        } else {
-          setCloseQuery(query);
-        }
-        setInputValue("", createChangeEventDetails(inputClear, eventDetails.event));
-      }
-    }
-    setOpenUnwrapped(nextOpen);
-    if (!nextOpen && inputInsidePopup && (eventDetails.reason === focusOut || eventDetails.reason === outsidePress)) {
-      setTouched(true);
-      setFocused(false);
-      if (validationMode === "onBlur") {
-        const valueToValidate = selectionMode === "none" ? inputValue : selectedValue;
-        validation.commit(valueToValidate);
-      }
-    }
-  });
-  const setSelectedValue = useStableCallback((nextValue, eventDetails) => {
-    onSelectedValueChange == null ? void 0 : onSelectedValueChange(nextValue, eventDetails);
-    if (eventDetails.isCanceled) {
-      return;
-    }
-    setSelectedValueUnwrapped(nextValue);
-    const shouldFillInput = selectionMode === "none" && popupRef.current && fillInputOnItemPress || single && !store.state.inputInsidePopup;
-    if (shouldFillInput) {
-      setInputValue(stringifyAsLabel(nextValue, itemToStringLabel), createChangeEventDetails(eventDetails.reason, eventDetails.event));
-    }
-    if (single && nextValue != null && eventDetails.reason !== inputChange && queryChangedAfterOpen) {
-      setCloseQuery(query);
-    }
-  });
-  const handleSelection = useStableCallback((event, passedValue) => {
-    var _a;
-    let value = passedValue;
-    if (value === void 0) {
-      if (activeIndex === null) {
-        return;
-      }
-      value = valuesRef.current[activeIndex];
-    }
-    const targetEl = getTarget(event);
-    const overrideEvent = selectionEventRef.current ?? event;
-    selectionEventRef.current = null;
-    const eventDetails = createChangeEventDetails(itemPress, overrideEvent);
-    const href = (_a = targetEl == null ? void 0 : targetEl.closest("a")) == null ? void 0 : _a.getAttribute("href");
-    if (href) {
-      if (href.startsWith("#")) {
-        setOpen(false, eventDetails);
-      }
-      return;
-    }
-    if (multiple) {
-      const currentSelectedValue = Array.isArray(selectedValue) ? selectedValue : [];
-      const isCurrentlySelected = itemIncludes(currentSelectedValue, value, store.state.isItemEqualToValue);
-      const nextValue = isCurrentlySelected ? removeItem(currentSelectedValue, value, store.state.isItemEqualToValue) : [...currentSelectedValue, value];
-      setSelectedValue(nextValue, eventDetails);
-      const wasFiltering = inputRef.current ? inputRef.current.value.trim() !== "" : false;
-      if (!wasFiltering) {
-        return;
-      }
-      if (store.state.inputInsidePopup) {
-        setInputValue("", createChangeEventDetails(inputClear, eventDetails.event));
-      } else {
-        setOpen(false, eventDetails);
-      }
-    } else {
-      setSelectedValue(value, eventDetails);
-      setOpen(false, eventDetails);
-    }
-  });
-  const requestSubmit = useStableCallback(() => {
-    var _a;
-    if (!store.state.submitOnItemClick) {
-      return;
-    }
-    const form = (_a = store.state.inputElement) == null ? void 0 : _a.form;
-    if (form && typeof form.requestSubmit === "function") {
-      form.requestSubmit();
-    }
-  });
-  const handleUnmount = useStableCallback(() => {
-    setMounted(false);
-    onOpenChangeComplete == null ? void 0 : onOpenChangeComplete(false);
-    setQueryChangedAfterOpen(false);
-    resetOpenInteractionType();
-    setCloseQuery(null);
-    if (selectionMode === "none") {
-      setIndices({
-        activeIndex: null,
-        selectedIndex: null
-      });
-    } else {
-      setIndices({
-        activeIndex: null
-      });
-    }
-    if (multiple && inputRef.current && inputRef.current.value !== "" && !hadInputClearRef.current) {
-      setInputValue("", createChangeEventDetails(inputClear));
-    }
-    if (single) {
-      if (store.state.inputInsidePopup) {
-        if (inputRef.current && inputRef.current.value !== "") {
-          setInputValue("", createChangeEventDetails(inputClear));
-        }
-      } else {
-        const stringVal = stringifyAsLabel(selectedValue, itemToStringLabel);
-        if (inputRef.current && inputRef.current.value !== stringVal) {
-          const reason = stringVal === "" ? inputClear : none;
-          setInputValue(stringVal, createChangeEventDetails(reason));
-        }
-      }
-    }
-  });
-  const resolvedPopupRef = React.useMemo(() => {
-    if (inline && positionerElement) {
-      return {
-        current: positionerElement.closest('[role="dialog"]')
-      };
-    }
-    return popupRef;
-  }, [inline, positionerElement]);
-  useOpenChangeComplete({
-    enabled: !props.actionsRef,
-    open,
-    ref: resolvedPopupRef,
-    onComplete() {
-      if (!open) {
-        handleUnmount();
-      }
-    }
-  });
-  React.useImperativeHandle(props.actionsRef, () => ({
-    unmount: handleUnmount
-  }), [handleUnmount]);
-  useIsoLayoutEffect(function syncSelectedIndex() {
-    if (open || selectionMode === "none") {
-      return;
-    }
-    const registry = items ? flatItems : allValuesRef.current;
-    if (multiple) {
-      const currentValue = Array.isArray(selectedValue) ? selectedValue : [];
-      const lastValue = currentValue[currentValue.length - 1];
-      const lastIndex = findItemIndex(registry, lastValue, isItemEqualToValue);
-      setIndices({
-        selectedIndex: lastIndex === -1 ? null : lastIndex
-      });
-    } else {
-      const index = findItemIndex(registry, selectedValue, isItemEqualToValue);
-      setIndices({
-        selectedIndex: index === -1 ? null : index
-      });
-    }
-  }, [open, selectedValue, items, selectionMode, flatItems, multiple, isItemEqualToValue, setIndices]);
-  useIsoLayoutEffect(() => {
-    if (items) {
-      valuesRef.current = flatFilteredItems;
-      listRef.current.length = flatFilteredItems.length;
-    }
-  }, [items, flatFilteredItems]);
-  useIsoLayoutEffect(() => {
-    const pendingHighlight = pendingQueryHighlightRef.current;
-    if (pendingHighlight) {
-      if (pendingHighlight.hasQuery) {
-        if (autoHighlightMode) {
-          store.set("activeIndex", 0);
-        }
-      } else if (autoHighlightMode === "always") {
-        store.set("activeIndex", 0);
-      }
-      pendingQueryHighlightRef.current = null;
-    }
-    if (!open && !inline) {
-      return;
-    }
-    const shouldUseFlatFilteredItems = hasItems || hasFilteredItemsProp;
-    const candidateItems = shouldUseFlatFilteredItems ? flatFilteredItems : valuesRef.current;
-    const storeActiveIndex = store.state.activeIndex;
-    if (storeActiveIndex == null) {
-      if (autoHighlightMode === "always" && candidateItems.length > 0) {
-        store.set("activeIndex", 0);
-        return;
-      }
-      if (lastHighlightRef.current !== INITIAL_LAST_HIGHLIGHT) {
-        lastHighlightRef.current = INITIAL_LAST_HIGHLIGHT;
-        store.state.onItemHighlighted(void 0, createGenericEventDetails(none, void 0, {
-          index: -1
-        }));
-      }
-      return;
-    }
-    if (storeActiveIndex >= candidateItems.length) {
-      if (lastHighlightRef.current !== INITIAL_LAST_HIGHLIGHT) {
-        lastHighlightRef.current = INITIAL_LAST_HIGHLIGHT;
-        store.state.onItemHighlighted(void 0, createGenericEventDetails(none, void 0, {
-          index: -1
-        }));
-      }
-      store.set("activeIndex", null);
-      return;
-    }
-    const nextActiveValue = candidateItems[storeActiveIndex];
-    const lastHighlightedValue = lastHighlightRef.current.value;
-    const isSameItem = lastHighlightedValue !== NO_ACTIVE_VALUE && store.state.isItemEqualToValue(nextActiveValue, lastHighlightedValue);
-    if (lastHighlightRef.current.index !== storeActiveIndex || !isSameItem) {
-      lastHighlightRef.current = {
-        value: nextActiveValue,
-        index: storeActiveIndex
-      };
-      store.state.onItemHighlighted(nextActiveValue, createGenericEventDetails(none, void 0, {
-        index: storeActiveIndex
-      }));
-    }
-  }, [activeIndex, autoHighlightMode, hasFilteredItemsProp, hasItems, flatFilteredItems, inline, open, store]);
-  useIsoLayoutEffect(() => {
-    if (!items || selectionMode === "none") {
-      return;
-    }
-    const registry = flatItems;
-    if (multiple) {
-      const current = Array.isArray(selectedValue) ? selectedValue : EMPTY_ARRAY;
-      const next = current.filter((v) => itemIncludes(registry, v, store.state.isItemEqualToValue));
-      if (next.length !== current.length) {
-        setSelectedValue(next, createChangeEventDetails(none));
-      }
-      return;
-    }
-    const isStillPresent = selectedValue == null || itemIncludes(registry, selectedValue, store.state.isItemEqualToValue);
-    if (isStillPresent) {
-      return;
-    }
-    let fallback = null;
-    if (defaultSelectedValue != null && itemIncludes(registry, defaultSelectedValue, store.state.isItemEqualToValue)) {
-      fallback = defaultSelectedValue;
-    }
-    setSelectedValue(fallback, createChangeEventDetails(none));
-  }, [items, flatItems, multiple, selectionMode, selectedValue, defaultSelectedValue, store, setSelectedValue]);
-  useIsoLayoutEffect(() => {
-    if (selectionMode === "none") {
-      setFilled(String(inputValue) !== "");
-      return;
-    }
-    setFilled(multiple ? Array.isArray(selectedValue) && selectedValue.length > 0 : selectedValue != null);
-  }, [setFilled, selectionMode, inputValue, selectedValue, multiple]);
-  React.useEffect(() => {
-    if (hasItems && autoHighlightMode && flatFilteredItems.length === 0) {
-      setIndices({
-        activeIndex: null
-      });
-    }
-  }, [hasItems, autoHighlightMode, flatFilteredItems.length, setIndices]);
-  useValueChanged(query, () => {
-    if (!open || query === "" || query === String(initialDefaultInputValue)) {
-      return;
-    }
-    setQueryChangedAfterOpen(true);
-  });
-  useValueChanged(selectedValue, () => {
-    if (selectionMode === "none") {
-      return;
-    }
-    clearErrors(name);
-    setDirty(selectedValue !== validityData.initialValue);
-    if (shouldValidateOnChange()) {
-      validation.commit(selectedValue);
-    } else {
-      validation.commit(selectedValue, true);
-    }
-    if (multiple && store.state.selectedIndex !== null && (!Array.isArray(selectedValue) || selectedValue.length === 0)) {
-      setIndices({
-        activeIndex: null,
-        selectedIndex: null
-      });
-    }
-    if (single && !hasInputValue && !inputInsidePopup) {
-      const nextInputValue = stringifyAsLabel(selectedValue, itemToStringLabel);
-      if (inputValue !== nextInputValue) {
-        setInputValue(nextInputValue, createChangeEventDetails(none));
-      }
-    }
-  });
-  useValueChanged(inputValue, () => {
-    if (selectionMode !== "none") {
-      return;
-    }
-    clearErrors(name);
-    setDirty(inputValue !== validityData.initialValue);
-    if (shouldValidateOnChange()) {
-      validation.commit(inputValue);
-    } else {
-      validation.commit(inputValue, true);
-    }
-  });
-  useValueChanged(items, () => {
-    if (!single || hasInputValue || inputInsidePopup || queryChangedAfterOpen) {
-      return;
-    }
-    const nextInputValue = stringifyAsLabel(selectedValue, itemToStringLabel);
-    if (inputValue !== nextInputValue) {
-      setInputValue(nextInputValue, createChangeEventDetails(none));
-    }
-  });
-  const floatingRootContext = useFloatingRootContext({
-    open: inline ? true : open,
-    onOpenChange: setOpen,
-    elements: {
-      reference: inputInsidePopup ? triggerElement : inputElement,
-      floating: positionerElement
-    }
-  });
-  let ariaHasPopup;
-  let ariaExpanded;
-  if (!inline) {
-    ariaHasPopup = grid ? "grid" : "listbox";
-    ariaExpanded = open ? "true" : "false";
-  }
-  const role = React.useMemo(() => {
-    const isPlainInput = (inputElement == null ? void 0 : inputElement.tagName) === "INPUT";
-    const shouldApplyAria = isPlainInput || open;
-    const reference = isPlainInput ? {
-      autoComplete: "off",
-      spellCheck: "false",
-      autoCorrect: "off",
-      autoCapitalize: "none"
-    } : {};
-    if (shouldApplyAria) {
-      reference.role = "combobox";
-      reference["aria-expanded"] = ariaExpanded;
-      reference["aria-haspopup"] = ariaHasPopup;
-      reference["aria-controls"] = open ? listElement == null ? void 0 : listElement.id : void 0;
-      reference["aria-autocomplete"] = autoComplete;
-    }
-    return {
-      reference,
-      floating: {
-        role: "presentation"
-      }
-    };
-  }, [inputElement, open, ariaExpanded, ariaHasPopup, listElement == null ? void 0 : listElement.id, autoComplete]);
-  const click = useClick(floatingRootContext, {
-    enabled: !readOnly && !disabled && openOnInputClick,
-    event: "mousedown-only",
-    toggle: false,
-    // Apply a small delay for touch to let iOS viewport centering settle.
-    // This avoids top-bottom flip flickers if the preferred position is "top" when first tapping.
-    touchOpenDelay: inputInsidePopup ? 0 : 50
-  });
-  const dismiss = useDismiss(floatingRootContext, {
-    enabled: !readOnly && !disabled && !inline,
-    outsidePressEvent: {
-      mouse: "sloppy",
-      // The visual viewport (affected by the mobile software keyboard) can be
-      // somewhat small. The user may want to scroll the screen to see more of
-      // the popup.
-      touch: "intentional"
-    },
-    // Without a popup, let the Escape key bubble the event up to other popups' handlers.
-    bubbles: inline ? true : void 0,
-    outsidePress(event) {
-      const target = getTarget(event);
-      return !contains(triggerElement, target) && !contains(clearRef.current, target) && !contains(chipsContainerRef.current, target);
-    }
-  });
-  const listNavigation = useListNavigation(floatingRootContext, {
-    enabled: !readOnly && !disabled,
-    id,
-    listRef,
-    activeIndex,
-    selectedIndex,
-    virtual: true,
-    loopFocus,
-    allowEscape: loopFocus && !autoHighlightMode,
-    focusItemOnOpen: queryChangedAfterOpen || selectionMode === "none" && !autoHighlightMode ? false : "auto",
-    focusItemOnHover: highlightItemOnHover,
-    resetOnPointerLeave: !keepHighlight,
-    // `cols` > 1 enables grid navigation.
-    // Since <Combobox.Row> infers column sizes (and is required when building a grid),
-    // it works correctly even with a value of `2`.
-    // Floating UI tests don't require `role="row"` wrappers, so retains the number API.
-    cols: grid ? 2 : 1,
-    orientation: grid ? "horizontal" : void 0,
-    disabledIndices: EMPTY_ARRAY,
-    onNavigate(nextActiveIndex, event) {
-      if (!event && !open || transitionStatus === "ending") {
-        return;
-      }
-      if (!event) {
-        setIndices({
-          activeIndex: nextActiveIndex
-        });
-      } else {
-        setIndices({
-          activeIndex: nextActiveIndex,
-          type: keyboardActiveRef.current ? "keyboard" : "pointer"
-        });
-      }
-    }
-  });
-  const {
-    getReferenceProps,
-    getFloatingProps,
-    getItemProps
-  } = useInteractions([role, click, dismiss, listNavigation]);
-  useOnFirstRender(() => {
-    store.update({
-      inline: inlineProp,
-      popupProps: getFloatingProps(),
-      inputProps: getReferenceProps(),
-      triggerProps,
-      getItemProps,
-      setOpen,
-      setInputValue,
-      setSelectedValue,
-      setIndices,
-      onItemHighlighted,
-      handleSelection,
-      forceMount,
-      requestSubmit
-    });
-  });
-  useIsoLayoutEffect(() => {
-    store.update({
-      id,
-      selectedValue,
-      open,
-      mounted,
-      transitionStatus,
-      items,
-      inline: inlineProp,
-      popupProps: getFloatingProps(),
-      inputProps: getReferenceProps(),
-      triggerProps,
-      openMethod,
-      getItemProps,
-      selectionMode,
-      name,
-      disabled,
-      readOnly,
-      required,
-      grid,
-      isGrouped,
-      virtualized,
-      onOpenChangeComplete,
-      openOnInputClick,
-      itemToStringLabel,
-      modal,
-      autoHighlight: autoHighlightMode,
-      isItemEqualToValue,
-      submitOnItemClick,
-      hasInputValue,
-      requestSubmit
-    });
-  }, [store, id, selectedValue, open, mounted, transitionStatus, items, getFloatingProps, getReferenceProps, getItemProps, openMethod, triggerProps, selectionMode, name, disabled, readOnly, required, validation, grid, isGrouped, virtualized, onOpenChangeComplete, openOnInputClick, itemToStringLabel, modal, isItemEqualToValue, submitOnItemClick, hasInputValue, inlineProp, requestSubmit, autoHighlightMode]);
-  const hiddenInputRef = useMergedRefs(inputRefProp, validation.inputRef);
-  const itemsContextValue = React.useMemo(() => ({
-    query,
-    filteredItems,
-    flatFilteredItems
-  }), [query, filteredItems, flatFilteredItems]);
-  const serializedValue = React.useMemo(() => {
-    if (Array.isArray(fieldRawValue)) {
-      return "";
-    }
-    return stringifyAsValue(fieldRawValue, itemToStringValue);
-  }, [fieldRawValue, itemToStringValue]);
-  const hasMultipleSelection = multiple && Array.isArray(selectedValue) && selectedValue.length > 0;
-  const hiddenInputs = React.useMemo(() => {
-    if (!multiple || !Array.isArray(selectedValue) || !name) {
-      return null;
-    }
-    return selectedValue.map((value) => {
-      const currentSerializedValue = stringifyAsValue(value, itemToStringValue);
-      return /* @__PURE__ */ jsx("input", {
-        type: "hidden",
-        name,
-        value: currentSerializedValue
-      }, currentSerializedValue);
-    });
-  }, [multiple, selectedValue, name, itemToStringValue]);
-  const children = /* @__PURE__ */ jsxs(React.Fragment, {
-    children: [props.children, /* @__PURE__ */ jsx("input", {
-      ...validation.getInputValidationProps({
-        // Move focus when the hidden input is focused.
-        onFocus() {
-          var _a;
-          if (inputInsidePopup) {
-            triggerElement == null ? void 0 : triggerElement.focus();
-            return;
-          }
-          (_a = inputRef.current || triggerElement) == null ? void 0 : _a.focus();
-        },
-        // Handle browser autofill.
-        onChange(event) {
-          if (event.nativeEvent.defaultPrevented) {
-            return;
-          }
-          const nextValue = event.target.value;
-          const details = createChangeEventDetails(inputChange, event.nativeEvent);
-          function handleChange() {
-            if (multiple) {
-              return;
-            }
-            if (selectionMode === "none") {
-              setDirty(nextValue !== validityData.initialValue);
-              setInputValue(nextValue, details);
-              if (shouldValidateOnChange()) {
-                validation.commit(nextValue);
-              }
-              return;
-            }
-            const matchingValue = valuesRef.current.find((v) => {
-              const candidate = stringifyAsValue(v, itemToStringValue);
-              if (candidate.toLowerCase() === nextValue.toLowerCase()) {
-                return true;
-              }
-              return false;
-            });
-            if (matchingValue != null) {
-              setDirty(matchingValue !== validityData.initialValue);
-              setSelectedValue == null ? void 0 : setSelectedValue(matchingValue, details);
-              if (shouldValidateOnChange()) {
-                validation.commit(matchingValue);
-              }
-            }
-          }
-          if (items) {
-            handleChange();
-          } else {
-            forceMount();
-            queueMicrotask(handleChange);
-          }
-        }
-      }),
-      name: multiple || selectionMode === "none" ? void 0 : name,
-      disabled,
-      required: required && !hasMultipleSelection,
-      readOnly,
-      value: serializedValue,
-      ref: hiddenInputRef,
-      style: name ? visuallyHiddenInput : visuallyHidden,
-      tabIndex: -1,
-      "aria-hidden": true
-    }), hiddenInputs]
-  });
-  return /* @__PURE__ */ jsx(ComboboxRootContext.Provider, {
-    value: store,
-    children: /* @__PURE__ */ jsx(ComboboxFloatingContext.Provider, {
-      value: floatingRootContext,
-      children: /* @__PURE__ */ jsx(ComboboxDerivedItemsContext.Provider, {
-        value: itemsContextValue,
-        children: /* @__PURE__ */ jsx(ComboboxInputValueContext.Provider, {
-          value: inputValue,
-          children
-        })
-      })
-    })
-  });
-}
-export {
-  AriaCombobox
-};
-//# sourceMappingURL=AriaCombobox.js.map