@jobber/components 9.6.0 → 9.6.2

package/dist/{ComboboxSeparator-cjs.js → ComboboxChipRemove-cjs.js}

@@ -7,8 +7,8 @@ var useCompositeListItem = require('./useCompositeListItem-cjs.js');
 var jsxRuntime = require('react/jsx-runtime');
 var ReactDOM = require('react-dom');
 var stringifyLocale = require('./stringifyLocale-cjs.js');
-var scrollable = require('./scrollable-cjs.js');
 var useLabel = require('./useLabel-cjs.js');
+var floatingUi_utils = require('./floating-ui.utils-cjs.js');
 
 function _interopNamespaceDefault(e) {
   var n = Object.create(null);
@@ -104,15 +104,15 @@ function useComboboxHasItemsContext() {
 }
 
 const selectors = {
-  id: state => state.id,
-  labelId: state => state.labelId,
-  items: state => state.items,
-  selectedValue: state => state.selectedValue,
-  hasSelectionChips: state => {
+  id: useScrollLock.createSelector(state => state.id),
+  labelId: useScrollLock.createSelector(state => state.labelId),
+  items: useScrollLock.createSelector(state => state.items),
+  selectedValue: useScrollLock.createSelector(state => state.selectedValue),
+  hasSelectionChips: useScrollLock.createSelector(state => {
     const selectedValue = state.selectedValue;
     return Array.isArray(selectedValue) && selectedValue.length > 0;
-  },
-  hasSelectedValue: state => {
+  }),
+  hasSelectedValue: useScrollLock.createSelector(state => {
     const {
       selectedValue,
       selectionMode
@@ -124,53 +124,53 @@ const selectors = {
       return selectedValue.length > 0;
     }
     return true;
-  },
-  hasNullItemLabel: (state, enabled) => {
+  }),
+  hasNullItemLabel: useScrollLock.createSelector((state, enabled) => {
     return enabled ? useCompositeListItem.hasNullItemLabel(state.items) : false;
-  },
-  open: state => state.open,
-  mounted: state => state.mounted,
-  forceMounted: state => state.forceMounted,
-  inline: state => state.inline,
-  activeIndex: state => state.activeIndex,
-  selectedIndex: state => state.selectedIndex,
-  isActive: (state, index) => state.activeIndex === index,
-  isSelected: (state, itemValue) => {
+  }),
+  open: useScrollLock.createSelector(state => state.open),
+  mounted: useScrollLock.createSelector(state => state.mounted),
+  forceMounted: useScrollLock.createSelector(state => state.forceMounted),
+  inline: useScrollLock.createSelector(state => state.inline),
+  activeIndex: useScrollLock.createSelector(state => state.activeIndex),
+  selectedIndex: useScrollLock.createSelector(state => state.selectedIndex),
+  isActive: useScrollLock.createSelector((state, index) => state.activeIndex === index),
+  isSelected: useScrollLock.createSelector((state, itemValue) => {
     const comparer = state.isItemEqualToValue;
     const selectedValue = state.selectedValue;
     if (Array.isArray(selectedValue)) {
       return selectedValue.some(selectedItem => useCompositeListItem.compareItemEquality(itemValue, selectedItem, comparer));
     }
     return useCompositeListItem.compareItemEquality(itemValue, selectedValue, comparer);
-  },
-  transitionStatus: state => state.transitionStatus,
-  popupProps: state => state.popupProps,
-  listProps: state => state.listProps,
-  inputProps: state => state.inputProps,
-  triggerProps: state => state.triggerProps,
-  itemProps: state => state.itemProps,
-  positionerElement: state => state.positionerElement,
-  listElement: state => state.listElement,
-  popupId: state => state.popupId,
-  triggerElement: state => state.triggerElement,
-  inputElement: state => state.inputElement,
-  inputGroupElement: state => state.inputGroupElement,
-  popupSide: state => state.popupSide,
-  openMethod: state => state.openMethod,
-  inputInsidePopup: state => state.inputInsidePopup,
-  inputOwnsFormValue: state => state.inputOwnsFormValue,
-  selectionMode: state => state.selectionMode,
-  name: state => state.name,
-  form: state => state.form,
-  disabled: state => state.disabled,
-  readOnly: state => state.readOnly,
-  required: state => state.required,
-  grid: state => state.grid,
-  virtualized: state => state.virtualized,
-  itemToStringLabel: state => state.itemToStringLabel,
-  isItemEqualToValue: state => state.isItemEqualToValue,
-  modal: state => state.modal,
-  autoHighlight: state => state.autoHighlight
+  }),
+  transitionStatus: useScrollLock.createSelector(state => state.transitionStatus),
+  popupProps: useScrollLock.createSelector(state => state.popupProps),
+  inputProps: useScrollLock.createSelector(state => state.inputProps),
+  triggerProps: useScrollLock.createSelector(state => state.triggerProps),
+  itemProps: useScrollLock.createSelector(state => state.itemProps),
+  positionerElement: useScrollLock.createSelector(state => state.positionerElement),
+  listElement: useScrollLock.createSelector(state => state.listElement),
+  popupId: useScrollLock.createSelector(state => state.popupId),
+  triggerElement: useScrollLock.createSelector(state => state.triggerElement),
+  inputElement: useScrollLock.createSelector(state => state.inputElement),
+  inputGroupElement: useScrollLock.createSelector(state => state.inputGroupElement),
+  popupSide: useScrollLock.createSelector(state => state.popupSide),
+  openMethod: useScrollLock.createSelector(state => state.openMethod),
+  inputInsidePopup: useScrollLock.createSelector(state => state.inputInsidePopup),
+  inputOwnsFormValue: useScrollLock.createSelector(state => state.inputOwnsFormValue),
+  selectionMode: useScrollLock.createSelector(state => state.selectionMode),
+  name: useScrollLock.createSelector(state => state.name),
+  form: useScrollLock.createSelector(state => state.form),
+  disabled: useScrollLock.createSelector(state => state.disabled),
+  readOnly: useScrollLock.createSelector(state => state.readOnly),
+  required: useScrollLock.createSelector(state => state.required),
+  grid: useScrollLock.createSelector(state => state.grid),
+  virtualized: useScrollLock.createSelector(state => state.virtualized),
+  itemToStringLabel: useScrollLock.createSelector(state => state.itemToStringLabel),
+  isItemEqualToValue: useScrollLock.createSelector(state => state.isItemEqualToValue),
+  modal: useScrollLock.createSelector(state => state.modal),
+  autoHighlight: useScrollLock.createSelector(state => state.autoHighlight),
+  submitOnItemClick: useScrollLock.createSelector(state => state.submitOnItemClick)
 };
 
 /**
@@ -193,7 +193,8 @@ function createCollatorItemFilter(collatorFilter, itemToStringLabel) {
     if (item == null) {
       return false;
     }
-    return collatorFilter.contains(item, query, itemToStringLabel);
+    const itemString = useCompositeListItem.stringifyAsLabel(item, itemToStringLabel);
+    return collatorFilter.contains(itemString, query);
   };
 }
 
@@ -209,13 +210,14 @@ function createSingleSelectionCollatorFilter(collatorFilter, itemToStringLabel,
     if (!query) {
       return true;
     }
+    const itemString = useCompositeListItem.stringifyAsLabel(item, itemToStringLabel);
     const selectedString = selectedValue != null ? useCompositeListItem.stringifyAsLabel(selectedValue, itemToStringLabel) : '';
 
     // Handle case-insensitive matching consistently
     if (selectedString && collatorFilter.contains(selectedString, query) && selectedString.length === query.length) {
       return true;
     }
-    return collatorFilter.contains(item, query, itemToStringLabel);
+    return collatorFilter.contains(itemString, query);
   };
 }
 
@@ -287,8 +289,9 @@ function useComboboxFilter(options = {}) {
     return createSingleSelectionCollatorFilter(coreFilter, itemToString, value)(item, query);
   }, [coreFilter, value, multiple]);
   return React__namespace.useMemo(() => ({
-    ...coreFilter,
-    contains
+    contains,
+    startsWith: coreFilter.startsWith,
+    endsWith: coreFilter.endsWith
   }), [contains, coreFilter]);
 }
 
@@ -309,7 +312,7 @@ function AriaCombobox(props) {
     inputValue: inputValueProp,
     open: openProp,
     defaultOpen = false,
-    selectionMode,
+    selectionMode = 'none',
     onItemHighlighted: onItemHighlightedProp,
     name: nameProp,
     form,
@@ -382,10 +385,12 @@ function AriaCombobox(props) {
    */
   const valuesRef = React__namespace.useRef([]);
   /**
-   * The item element that received the last `pointerdown`, used to detect whether a
-   * `mouseup` on an item belongs to a drag-select gesture that started elsewhere.
+   * Contains all item values in a stable, unfiltered order.
+   * This is only used when `items` prop is not provided.
+   * It accumulates values on first mount and does not remove them on unmount due to
+   * filtering, providing a stable index for selected value tracking.
    */
-  const pointerDownItemRef = React__namespace.useRef(null);
+  const allValuesRef = React__namespace.useRef([]);
   const disabled = fieldDisabled || disabledProp;
   const name = fieldName ?? nameProp;
   const multiple = selectionMode === 'multiple';
@@ -412,10 +417,11 @@ function AriaCombobox(props) {
     if (filterProp !== undefined) {
       return filterProp;
     }
-    // `shouldBypassFiltering` already empties the query whenever a single selection's label
-    // matches it exactly, so the filter never needs a selection-aware variant here.
+    if (single && !queryChangedAfterOpen) {
+      return createSingleSelectionCollatorFilter(collatorFilter, itemToStringLabel, selectedValue);
+    }
     return createCollatorItemFilter(collatorFilter, itemToStringLabel);
-  }, [filterProp, collatorFilter, itemToStringLabel]);
+  }, [filterProp, single, selectedValue, queryChangedAfterOpen, collatorFilter, itemToStringLabel]);
 
   // If neither inputValue nor defaultInputValue are provided, derive it from the
   // selected value for single mode so the input reflects the selection on mount.
@@ -441,9 +447,9 @@ function AriaCombobox(props) {
     state: 'open'
   });
   const isGrouped = useCompositeListItem.isGroupedItems(items);
-  const query = closeQuery ?? String(inputValue).trim();
+  const query = closeQuery ?? (inputValue === '' ? '' : String(inputValue).trim());
   const selectedLabelString = single ? useCompositeListItem.stringifyAsLabel(selectedValue, itemToStringLabel) : '';
-  const shouldBypassFiltering = single && !queryChangedAfterOpen && query !== '' && selectedLabelString.length === query.length && collatorFilter.contains(selectedLabelString, query);
+  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__namespace.useMemo(() => {
@@ -470,18 +476,12 @@ function AriaCombobox(props) {
         if (limit > -1 && currentCount >= limit) {
           break;
         }
-        const remainingLimit = limit > -1 ? limit - currentCount : Infinity;
-        const itemsToTake = filterQuery === '' ? group.items.slice(0, remainingLimit) : [];
-        if (filterQuery !== '') {
-          for (const item of group.items) {
-            if (itemsToTake.length >= remainingLimit) {
-              break;
-            }
-            if (filter(item, filterQuery, itemToStringLabel)) {
-              itemsToTake.push(item);
-            }
-          }
+        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,
@@ -521,85 +521,76 @@ function AriaCombobox(props) {
     }
     return filteredItems;
   }, [filteredItems, isGrouped]);
-  const store = useRenderElement.useRefWithInit(() => {
-    // An inline list open on the first render never gets a closed pass of the closed-state
-    // sync effect below, and `items`-prop lists don't self-register their index the way
-    // individually rendered `<Combobox.Item>`s do, so the selected item was never highlighted.
-    // Seeding the index here lets list navigation highlight and scroll to the selection on
-    // mount. Computed once by construction, so a selection or list that resolves after mount
-    // doesn't move an existing highlight or scroll the list away.
-    let initialSelectedIndex = null;
-    if (inlineProp && open && hasItems && selectionMode !== 'none') {
-      initialSelectedIndex = useCompositeListItem.findSelectionIndex(flatFilteredItems, selectedValue, isItemEqualToValue, multiple);
-    }
-    return new useScrollLock.Store({
-      id,
-      labelId: undefined,
-      selectedValue,
-      open,
-      items,
-      selectionMode,
-      listRef,
-      labelsRef,
-      popupRef,
-      emptyRef,
-      inputRef,
-      startDismissRef,
-      endDismissRef,
-      keyboardActiveRef,
-      chipsContainerRef,
-      clearRef,
-      valuesRef,
-      pointerDownItemRef,
-      selectionEventRef,
-      name,
-      form,
-      disabled,
-      readOnly,
-      required,
-      grid,
-      virtualized,
-      openOnInputClick,
-      itemToStringLabel,
-      isItemEqualToValue,
-      modal,
-      autoHighlight: autoHighlightMode,
-      submitOnItemClick,
-      hasInputValue,
-      mounted: false,
-      forceMounted: false,
-      transitionStatus: 'idle',
-      inline: inlineProp,
-      activeIndex: null,
-      selectedIndex: initialSelectedIndex,
-      popupProps: {},
-      listProps: {},
-      inputProps: {},
-      triggerProps: {},
-      itemProps: useRenderElement.EMPTY_OBJECT,
-      positionerElement: null,
-      listElement: null,
-      popupId: undefined,
-      triggerElement: null,
-      inputElement: null,
-      inputGroupElement: null,
-      popupSide: null,
-      openMethod: null,
-      inputInsidePopup: true,
-      // Avoid duplicate names in the server HTML. Popup inputs aren't rendered
-      // until after hydration, so the hidden input takes over then if needed.
-      inputOwnsFormValue: selectionMode === 'none',
-      // Placeholder callbacks replaced on first render
-      onOpenChangeComplete: useRenderElement.NOOP,
-      setOpen: useRenderElement.NOOP,
-      setInputValue: useRenderElement.NOOP,
-      setSelectedValue: useRenderElement.NOOP,
-      setIndices: useRenderElement.NOOP,
-      handleSelection: useRenderElement.NOOP,
-      forceMount: useRenderElement.NOOP,
-      requestSubmit: useRenderElement.NOOP
-    });
-  }).current;
+  const store = useRenderElement.useRefWithInit(() => new useScrollLock.Store({
+    id,
+    labelId: undefined,
+    selectedValue,
+    open,
+    filter,
+    query,
+    items,
+    selectionMode,
+    listRef,
+    labelsRef,
+    popupRef,
+    emptyRef,
+    inputRef,
+    startDismissRef,
+    endDismissRef,
+    keyboardActiveRef,
+    chipsContainerRef,
+    clearRef,
+    valuesRef,
+    allValuesRef,
+    selectionEventRef,
+    name,
+    form,
+    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: {},
+    itemProps: useRenderElement.EMPTY_OBJECT,
+    positionerElement: null,
+    listElement: null,
+    popupId: undefined,
+    triggerElement: null,
+    inputElement: null,
+    inputGroupElement: null,
+    popupSide: null,
+    openMethod: null,
+    inputInsidePopup: true,
+    // Avoid duplicate names in the server HTML. Popup inputs aren't rendered
+    // until after hydration, so the hidden input takes over then if needed.
+    inputOwnsFormValue: selectionMode === 'none',
+    onOpenChangeComplete: onOpenChangeCompleteProp || useRenderElement.NOOP,
+    // Placeholder callbacks replaced on first render
+    setOpen: useRenderElement.NOOP,
+    setInputValue: useRenderElement.NOOP,
+    setSelectedValue: useRenderElement.NOOP,
+    setIndices: useRenderElement.NOOP,
+    onItemHighlighted: useRenderElement.NOOP,
+    handleSelection: useRenderElement.NOOP,
+    forceMount: useRenderElement.NOOP,
+    requestSubmit: useRenderElement.NOOP
+  })).current;
   const fieldRawValue = selectionMode === 'none' ? inputValue : selectedValue;
   const fieldStringValue = React__namespace.useMemo(() => {
     if (selectionMode === 'none') {
@@ -642,38 +633,35 @@ function AriaCombobox(props) {
       store.set('forceMounted', true);
     }
   });
-
-  /**
-   * Emits `onItemHighlighted` for the item at `index`, or clears the highlight when `index` is `-1`
-   * (a no-op if nothing was highlighted). Keeps `lastHighlightRef` in sync with what was emitted.
-   */
-  const emitHighlight = useScrollLock.useStableCallback((value, index, type) => {
-    if (index === -1) {
-      if (lastHighlightRef.current === INITIAL_LAST_HIGHLIGHT) {
-        return;
-      }
-      lastHighlightRef.current = INITIAL_LAST_HIGHLIGHT;
-    } else {
-      lastHighlightRef.current = {
-        value,
-        index
-      };
+  const initialSelectedValueRef = React__namespace.useRef(selectedValue);
+  useScrollLock.useIsoLayoutEffect(() => {
+    // Ensure the values and labels are registered for programmatic value changes.
+    if (selectedValue !== initialSelectedValueRef.current) {
+      forceMount();
     }
-    onItemHighlighted(value, useScrollLock.createGenericEventDetails(type, undefined, {
-      index
-    }));
-  });
+  }, [forceMount, selectedValue]);
   const setIndices = useScrollLock.useStableCallback(options => {
     store.update(options);
-    const activeIndexOption = options.activeIndex;
-    if (activeIndexOption === undefined) {
+    const type = options.type || 'none';
+    if (options.activeIndex === undefined) {
       return;
     }
-    const type = options.type || useScrollLock.none;
-    if (activeIndexOption === null) {
-      emitHighlight(undefined, -1, type);
+    if (options.activeIndex === null) {
+      if (lastHighlightRef.current !== INITIAL_LAST_HIGHLIGHT) {
+        lastHighlightRef.current = INITIAL_LAST_HIGHLIGHT;
+        onItemHighlighted(undefined, useScrollLock.createGenericEventDetails(type, undefined, {
+          index: -1
+        }));
+      }
     } else {
-      emitHighlight(valuesRef.current[activeIndexOption], activeIndexOption, type);
+      const activeValue = valuesRef.current[options.activeIndex];
+      lastHighlightRef.current = {
+        value: activeValue,
+        index: options.activeIndex
+      };
+      onItemHighlighted(activeValue, useScrollLock.createGenericEventDetails(type, undefined, {
+        index: options.activeIndex
+      }));
     }
   });
   const setInputValue = useScrollLock.useStableCallback((next, eventDetails) => {
@@ -686,11 +674,6 @@ function AriaCombobox(props) {
     // If user is typing, ensure we don't auto-highlight on open due to a race
     // with the post-open effect that sets this flag.
     if (eventDetails.reason === useScrollLock.inputChange) {
-      // A controlled popup may ignore a close request. Resuming input proves the popup
-      // is remaining open, so release the query captured for an exit animation.
-      if (open && closeQuery !== null) {
-        setCloseQuery(null);
-      }
       const event = eventDetails.event;
       const inputType = event.inputType;
       // Treat composition commits as typed input; autofill may omit `inputType` or
@@ -706,34 +689,10 @@ function AriaCombobox(props) {
         pendingQueryHighlightRef.current = {
           hasQuery
         };
-
-        // Virtualized lists own their scroller. Reset regular lists directly so a stale
-        // composite registry cannot select a reordered item and scrolling cannot escape
-        // the popup.
-        const list = store.state.listElement;
-        if (!store.state.virtualized && list) {
-          const popup = popupRef.current;
-          for (const ancestor of useScrollLock.getOverflowAncestors(list.firstElementChild ?? list)) {
-            if (!useScrollLock.isHTMLElement(ancestor) || (popup ? !useScrollLock.contains(popup, ancestor) : ancestor.getAttribute('role') === 'dialog')) {
-              break;
-            }
-            if (scrollable.isScrollableY(ancestor)) {
-              ancestor.scrollTop = 0;
-              break;
-            }
-          }
-        }
-        if (hasQuery && autoHighlightMode && store.state.activeIndex == null && (open || inline)) {
+        if (hasQuery && autoHighlightMode && store.state.activeIndex == null) {
           store.set('activeIndex', 0);
         }
       }
-    } else if (eventDetails.reason === useScrollLock.inputClear && next === '' && store.state.inputInsidePopup) {
-      // A programmatic clear of an active query (e.g. after selecting an item with the
-      // input inside the popup): restore the highlight to the selected item.
-      pendingQueryHighlightRef.current = {
-        hasQuery: false,
-        selection: true
-      };
     }
     setInputValueUnwrapped(next);
   });
@@ -745,7 +704,7 @@ function AriaCombobox(props) {
     // If the `Empty` component is not used, the positioner or popup should be hidden
     // with CSS. In this case, allow the Escape key to bubble to close a parent popup
     // if there are no items to show.
-    if (eventDetails.reason === useScrollLock.escapeKey && hasItems && flatFilteredItems.length === 0 && !emptyRef.current) {
+    if (eventDetails.reason === 'escape-key' && hasItems && flatFilteredItems.length === 0 && !store.state.emptyRef.current) {
       eventDetails.allowPropagation();
     }
     props.onOpenChange?.(nextOpen, eventDetails);
@@ -755,10 +714,10 @@ function AriaCombobox(props) {
 
     // If reopening interrupts the close animation, handleUnmount won't run to clear the
     // frozen closeQuery and pending popup input.
-    if (nextOpen && inputInsidePopup && !inline && closeQuery !== null) {
+    if (nextOpen && multiple && inputInsidePopup && !inline && closeQuery !== null) {
       setQueryChangedAfterOpen(false);
       setCloseQuery(null);
-      if (inputValue !== '' && eventDetails.reason !== useScrollLock.inputChange) {
+      if (inputValue !== '') {
         setInputValue('', useScrollLock.createChangeEventDetails(useScrollLock.inputClear, eventDetails.event));
       }
     }
@@ -812,8 +771,18 @@ function AriaCombobox(props) {
     if (shouldFillInput) {
       setInputValue(useCompositeListItem.stringifyAsLabel(nextValue, itemToStringLabel), useScrollLock.createChangeEventDetails(eventDetails.reason, eventDetails.event));
     }
+    if (single && nextValue != null && eventDetails.reason !== useScrollLock.inputChange && queryChangedAfterOpen && !inline) {
+      setCloseQuery(query);
+    }
   });
-  const handleSelection = useScrollLock.useStableCallback((event, itemValue) => {
+  const handleSelection = useScrollLock.useStableCallback((event, passedValue) => {
+    let itemValue = passedValue;
+    if (itemValue === undefined) {
+      if (activeIndex === null) {
+        return;
+      }
+      itemValue = valuesRef.current[activeIndex];
+    }
     const targetEl = useScrollLock.getTarget(event);
     const overrideEvent = selectionEventRef.current ?? event;
     selectionEventRef.current = null;
@@ -829,8 +798,8 @@ function AriaCombobox(props) {
     }
     if (multiple) {
       const currentSelectedValue = Array.isArray(selectedValue) ? selectedValue : [];
-      const isCurrentlySelected = useCompositeListItem.selectedValueIncludes(currentSelectedValue, itemValue, isItemEqualToValue);
-      const nextValue = isCurrentlySelected ? useCompositeListItem.removeItem(currentSelectedValue, itemValue, isItemEqualToValue) : [...currentSelectedValue, itemValue];
+      const isCurrentlySelected = useCompositeListItem.selectedValueIncludes(currentSelectedValue, itemValue, store.state.isItemEqualToValue);
+      const nextValue = isCurrentlySelected ? useCompositeListItem.removeItem(currentSelectedValue, itemValue, store.state.isItemEqualToValue) : [...currentSelectedValue, itemValue];
       setSelectedValue(nextValue, eventDetails);
       if (eventDetails.isCanceled) {
         return;
@@ -853,6 +822,9 @@ function AriaCombobox(props) {
     }
   });
   const requestSubmit = useScrollLock.useStableCallback(() => {
+    if (!store.state.submitOnItemClick) {
+      return;
+    }
     const formElement = validation.inputRef.current?.form ?? store.state.inputElement?.form;
     if (formElement && typeof formElement.requestSubmit === 'function') {
       formElement.requestSubmit();
@@ -925,29 +897,25 @@ function AriaCombobox(props) {
   React__namespace.useImperativeHandle(props.actionsRef, () => ({
     unmount: handleUnmount
   }), [handleUnmount]);
-  useScrollLock.useIsoLayoutEffect(function syncClosedState() {
-    if (open) {
+  useScrollLock.useIsoLayoutEffect(function syncSelectedIndex() {
+    if (open || selectionMode === 'none') {
       return;
     }
-
-    // State-driven (not tied to the internal event path) so controlled closes
-    // also clear a pointerdown that never received a matching item mouseup.
-    pointerDownItemRef.current = null;
-    if (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 = useCompositeListItem.findItemIndex(registry, lastValue, isItemEqualToValue);
+      setIndices({
+        selectedIndex: lastIndex === -1 ? null : lastIndex
+      });
+    } else {
+      const index = useCompositeListItem.findItemIndex(registry, selectedValue, isItemEqualToValue);
+      setIndices({
+        selectedIndex: index === -1 ? null : index
+      });
     }
-
-    // Without `items`, look the selection up in the live registry of mounted item
-    // values (the list stays mounted while closed when closed-state features need
-    // it — trigger interaction and rendered-label autofill force-mount it). Mounted
-    // items re-assert the index themselves when their registration moves; when
-    // nothing is mounted the lookup resolves to `null` and each item re-registers
-    // the index on the next open.
-    const registry = hasItems ? flatItems : valuesRef.current;
-    setIndices({
-      selectedIndex: useCompositeListItem.findSelectionIndex(registry, selectedValue, isItemEqualToValue, multiple)
-    });
-  }, [open, selectedValue, selectionMode, multiple, hasItems, flatItems, isItemEqualToValue, setIndices]);
+  }, [open, selectedValue, items, selectionMode, flatItems, multiple, isItemEqualToValue, setIndices]);
   useScrollLock.useIsoLayoutEffect(() => {
     if (items) {
       valuesRef.current = flatFilteredItems;
@@ -957,52 +925,14 @@ function AriaCombobox(props) {
   useScrollLock.useIsoLayoutEffect(() => {
     const pendingHighlight = pendingQueryHighlightRef.current;
     if (pendingHighlight) {
-      // A directly rendered list remains visible when the popup state is closed, while a
-      // kept-mounted Positioner is hidden and should stay inert.
-      const listIsNavigable = open || inline || store.state.positionerElement?.hidden === false;
       if (pendingHighlight.hasQuery) {
-        if (autoHighlightMode && listIsNavigable) {
+        if (autoHighlightMode) {
           store.set('activeIndex', 0);
         }
-        pendingQueryHighlightRef.current = null;
-      } else if (String(inputValue).trim() === '') {
-        // Only handle the clear once it has committed (a controlled input may reject it),
-        // so a restore cannot fire while a query is still active.
-        pendingQueryHighlightRef.current = null;
-        if (listIsNavigable) {
-          const clearedBySelection = pendingHighlight.selection;
-          if (autoHighlightMode === 'always' && !clearedBySelection && store.state.selectionMode === 'none') {
-            // There is no selection to restore in Autocomplete. Keep the first-item reset
-            // synchronous so list navigation sees it before a directly rendered list closes.
-            store.set('activeIndex', 0);
-          }
-
-          // Items re-mounted by the clear publish their composite indices in a follow-up
-          // commit, so the item registries are mid-update here. Defer past React's cascade.
-          queueMicrotask(() => {
-            if (!store.state.open && !store.state.inline || inputRef.current && inputRef.current.value.trim() !== '') {
-              return;
-            }
-
-            // Return the highlight to the selected item, the same anchor the popup uses
-            // when it first opens. Read the selection through the store so consumers can
-            // pass an inline `isItemEqualToValue` or a fresh `selectedValue` array without
-            // re-running this effect on every render.
-            const currentSelectedValue = store.state.selectedValue;
-            const isMultiple = store.state.selectionMode === 'multiple';
-            const lastSelectedValue = isMultiple && Array.isArray(currentSelectedValue) ? currentSelectedValue[currentSelectedValue.length - 1] : currentSelectedValue;
-            const hasSelection = store.state.selectionMode !== 'none' && lastSelectedValue != null;
-            if (hasSelection || clearedBySelection) {
-              const registry = hasItems || hasFilteredItemsProp ? flatFilteredItems : valuesRef.current;
-              // A selection that is no longer in the list drops the highlight rather than
-              // leaving it on whichever item now occupies that index.
-              store.set('activeIndex', hasSelection ? useCompositeListItem.findSelectionIndex(registry, currentSelectedValue, store.state.isItemEqualToValue, isMultiple) : null);
-            } else if (autoHighlightMode === 'always') {
-              store.set('activeIndex', 0);
-            }
-          });
-        }
+      } else if (autoHighlightMode === 'always') {
+        store.set('activeIndex', 0);
       }
+      pendingQueryHighlightRef.current = null;
     }
     if (!open && !inline) {
       return;
@@ -1015,11 +945,21 @@ function AriaCombobox(props) {
         store.set('activeIndex', 0);
         return;
       }
-      emitHighlight(undefined, -1, useScrollLock.none);
+      if (lastHighlightRef.current !== INITIAL_LAST_HIGHLIGHT) {
+        lastHighlightRef.current = INITIAL_LAST_HIGHLIGHT;
+        store.state.onItemHighlighted(undefined, useScrollLock.createGenericEventDetails(useScrollLock.none, undefined, {
+          index: -1
+        }));
+      }
       return;
     }
     if (storeActiveIndex >= candidateItems.length) {
-      emitHighlight(undefined, -1, useScrollLock.none);
+      if (lastHighlightRef.current !== INITIAL_LAST_HIGHLIGHT) {
+        lastHighlightRef.current = INITIAL_LAST_HIGHLIGHT;
+        store.state.onItemHighlighted(undefined, useScrollLock.createGenericEventDetails(useScrollLock.none, undefined, {
+          index: -1
+        }));
+      }
       store.set('activeIndex', null);
       return;
     }
@@ -1027,12 +967,15 @@ function AriaCombobox(props) {
     const previouslyHighlightedItemValue = lastHighlightRef.current.value;
     const isSameItem = previouslyHighlightedItemValue !== NO_ACTIVE_VALUE && useCompositeListItem.compareItemEquality(itemValue, previouslyHighlightedItemValue, store.state.isItemEqualToValue);
     if (lastHighlightRef.current.index !== storeActiveIndex || !isSameItem) {
-      emitHighlight(itemValue, storeActiveIndex, useScrollLock.none);
+      lastHighlightRef.current = {
+        value: itemValue,
+        index: storeActiveIndex
+      };
+      store.state.onItemHighlighted(itemValue, useScrollLock.createGenericEventDetails(useScrollLock.none, undefined, {
+        index: storeActiveIndex
+      }));
     }
-  }, [activeIndex, autoHighlightMode, emitHighlight, hasFilteredItemsProp, hasItems, flatFilteredItems, inline, open, store,
-  // Reruns the effect when the query changes without affecting the deps above, such as
-  // clearing the input when no items are filtered out (individually rendered items).
-  inputValue]);
+  }, [activeIndex, autoHighlightMode, hasFilteredItemsProp, hasItems, flatFilteredItems, inline, open, store]);
   useScrollLock.useIsoLayoutEffect(() => {
     if (selectionMode === 'none') {
       setFilled(String(inputValue) !== '');
@@ -1063,12 +1006,6 @@ function AriaCombobox(props) {
     }
     setQueryChangedAfterOpen(true);
   });
-  function syncInputToSelectedLabel() {
-    const nextInputValue = useCompositeListItem.stringifyAsLabel(selectedValue, itemToStringLabel);
-    if (inputValue !== nextInputValue) {
-      setInputValue(nextInputValue, useScrollLock.createChangeEventDetails(useScrollLock.none));
-    }
-  }
   useScrollLock.useValueChanged(selectedValue, () => {
     if (selectionMode === 'none') {
       return;
@@ -1077,7 +1014,10 @@ function AriaCombobox(props) {
     setDirty(isSelectedValueDirty(selectedValue));
     validation.change(selectedValue);
     if (single && !hasInputValue && !inputInsidePopup) {
-      syncInputToSelectedLabel();
+      const nextInputValue = useCompositeListItem.stringifyAsLabel(selectedValue, itemToStringLabel);
+      if (inputValue !== nextInputValue) {
+        setInputValue(nextInputValue, useScrollLock.createChangeEventDetails(useScrollLock.none));
+      }
     }
   });
   useScrollLock.useValueChanged(inputValue, () => {
@@ -1092,7 +1032,10 @@ function AriaCombobox(props) {
     if (!single || hasInputValue || inputInsidePopup || queryChangedAfterOpen) {
       return;
     }
-    syncInputToSelectedLabel();
+    const nextInputValue = useCompositeListItem.stringifyAsLabel(selectedValue, itemToStringLabel);
+    if (inputValue !== nextInputValue) {
+      setInputValue(nextInputValue, useScrollLock.createChangeEventDetails(useScrollLock.none));
+    }
   });
   const floatingRootContext = useCompositeListItem.useFloatingRootContext({
     open: inline ? true : open,
@@ -1102,19 +1045,18 @@ function AriaCombobox(props) {
       floating: positionerElement
     }
   });
-  const ariaHasPopup = grid ? 'grid' : 'listbox';
-  // An inline list isn't gated on `open`: it renders for as long as it's in the tree, so the
-  // combobox is permanently expanded even while the internal open state is `false`.
-  const expanded = open || inline;
-  const ariaExpanded = expanded ? 'true' : 'false';
+  let ariaHasPopup;
+  let ariaExpanded;
+  if (!inline) {
+    ariaHasPopup = grid ? 'grid' : 'listbox';
+    ariaExpanded = open ? 'true' : 'false';
+  }
   const role = React__namespace.useMemo(() => {
     const isPlainInput = inputElement?.tagName === 'INPUT';
     // During SSR and initial hydration, the input ref is not available yet.
     // Assume an input-like control so combobox ARIA attributes are present.
     const shouldTreatAsInput = inputElement == null || isPlainInput;
-    // A non-input control only takes on combobox semantics while the list is exposed, which for
-    // an inline list is the whole time.
-    const shouldApplyAria = shouldTreatAsInput || expanded;
+    const shouldApplyAria = shouldTreatAsInput || open;
     const reference = shouldTreatAsInput ? {
       autoComplete: 'off',
       spellCheck: 'false',
@@ -1125,7 +1067,7 @@ function AriaCombobox(props) {
       reference.role = 'combobox';
       reference['aria-expanded'] = ariaExpanded;
       reference['aria-haspopup'] = ariaHasPopup;
-      reference['aria-controls'] = expanded ? listElement?.id : undefined;
+      reference['aria-controls'] = open ? listElement?.id : undefined;
       reference['aria-autocomplete'] = autoComplete;
     }
     return {
@@ -1134,7 +1076,7 @@ function AriaCombobox(props) {
         role: 'presentation'
       }
     };
-  }, [inputElement, expanded, ariaExpanded, ariaHasPopup, listElement?.id, autoComplete]);
+  }, [inputElement, open, ariaExpanded, ariaHasPopup, listElement?.id, autoComplete]);
   const click = useScrollLock.useClick(floatingRootContext, {
     enabled: !readOnly && !disabled && openOnInputClick,
     event: 'mousedown-only',
@@ -1188,7 +1130,7 @@ function AriaCombobox(props) {
       } else {
         setIndices({
           activeIndex: nextActiveIndex,
-          type: keyboardActiveRef.current ? useScrollLock.keyboard : useScrollLock.pointer
+          type: keyboardActiveRef.current ? 'keyboard' : 'pointer'
         });
       }
     }
@@ -1203,8 +1145,7 @@ function AriaCombobox(props) {
       }
     }
   }, dismiss.reference, click.reference, role.reference), [listNavigation.reference, dismiss.reference, click.reference, role.reference, grid, store]);
-  const popupProps = React__namespace.useMemo(() => useRenderElement.mergeProps(useScrollLock.FOCUSABLE_POPUP_PROPS, dismiss.floating), [dismiss.floating]);
-  const listProps = React__namespace.useMemo(() => useRenderElement.mergeProps(listNavigation.floating, role.floating), [listNavigation.floating, role.floating]);
+  const popupProps = React__namespace.useMemo(() => useRenderElement.mergeProps(useScrollLock.FOCUSABLE_POPUP_PROPS, listNavigation.floating, dismiss.floating, role.floating), [listNavigation.floating, dismiss.floating, role.floating]);
   const itemProps = React__namespace.useMemo(() => {
     const listNavigationItemProps = listNavigation.item;
     if (!listNavigationItemProps) {
@@ -1218,11 +1159,10 @@ function AriaCombobox(props) {
       onFocus: undefined
     };
   }, [listNavigation.item]);
-  useCompositeListItem.useOnFirstRender(() => {
+  useScrollLock.useOnFirstRender(() => {
     store.update({
       inline: inlineProp,
       popupProps,
-      listProps,
       inputProps,
       triggerProps,
       itemProps,
@@ -1230,10 +1170,10 @@ function AriaCombobox(props) {
       setInputValue,
       setSelectedValue,
       setIndices,
+      onItemHighlighted,
       handleSelection,
       forceMount,
-      requestSubmit,
-      onOpenChangeComplete
+      requestSubmit
     });
   });
   useScrollLock.useIsoLayoutEffect(() => {
@@ -1246,7 +1186,6 @@ function AriaCombobox(props) {
       items,
       inline: inlineProp,
       popupProps,
-      listProps,
       inputProps,
       triggerProps,
       openMethod,
@@ -1258,7 +1197,9 @@ function AriaCombobox(props) {
       readOnly,
       required,
       grid,
+      isGrouped,
       virtualized,
+      onOpenChangeComplete,
       openOnInputClick,
       itemToStringLabel,
       modal,
@@ -1266,9 +1207,10 @@ function AriaCombobox(props) {
       isItemEqualToValue,
       submitOnItemClick,
       hasInputValue,
+      requestSubmit,
       inputOwnsFormValue: selectionMode === 'none' && (inlineProp || !store.state.inputInsidePopup)
     });
-  }, [store, id, selectedValue, open, mounted, transitionStatus, items, popupProps, listProps, inputProps, itemProps, openMethod, triggerProps, selectionMode, name, disabled, readOnly, required, grid, virtualized, openOnInputClick, itemToStringLabel, modal, isItemEqualToValue, submitOnItemClick, hasInputValue, inlineProp, autoHighlightMode, form]);
+  }, [store, id, selectedValue, open, mounted, transitionStatus, items, popupProps, inputProps, itemProps, openMethod, triggerProps, selectionMode, name, disabled, readOnly, required, validation, grid, isGrouped, virtualized, onOpenChangeComplete, openOnInputClick, itemToStringLabel, modal, isItemEqualToValue, submitOnItemClick, hasInputValue, inlineProp, requestSubmit, autoHighlightMode, form]);
   const hiddenInputRef = useRenderElement.useMergedRefs(inputRefProp, validation.inputRef);
   const itemsContextValue = React__namespace.useMemo(() => ({
     query,
@@ -1312,7 +1254,7 @@ function AriaCombobox(props) {
         },
         // Handle browser autofill.
         onChange(event) {
-          // Workaround for https://github.com/react/react/issues/9023
+          // Workaround for https://github.com/facebook/react/issues/9023
           if (event.nativeEvent.defaultPrevented || disabled || readOnly) {
             return;
           }
@@ -1407,51 +1349,7 @@ const triggerStateAttributesMapping = {
   } : null
 };
 
-/**
- * The popup side is only meaningful while the positioner is mounted, as the store retains the
- * last resolved side after the popup unmounts.
- */
-function usePopupSide(store) {
-  const mounted = useScrollLock.useStore(store, selectors.mounted);
-  const popupSide = useScrollLock.useStore(store, selectors.popupSide);
-  const positionerElement = useScrollLock.useStore(store, selectors.positionerElement);
-  return mounted && positionerElement ? popupSide : null;
-}
-
-/**
- * Whether the filtered list has no items to show.
- */
-function useListEmpty() {
-  return useComboboxDerivedItemsContext().filteredItems.length === 0;
-}
-
-/**
- * The arrow keys that move the chip highlight backwards and forwards, in that order.
- */
-function getChipNavigationKeys(direction) {
-  return direction === 'rtl' ? ['ArrowRight', 'ArrowLeft'] : ['ArrowLeft', 'ArrowRight'];
-}
-
-/**
- * Where the highlight lands once the chip at `index` is removed, or `undefined` for no highlight.
- */
-function getIndexAfterChipRemoval(index, chipCount) {
-  const nextIndex = index >= chipCount - 1 ? chipCount - 2 : index;
-  return nextIndex >= 0 ? nextIndex : undefined;
-}
-
-/**
- * Commits the highlighted item by clicking it, tagging the originating event so the item's
- * handler can attribute the selection to it.
- */
-function clickHighlightedItem(store, activeIndex, nativeEvent) {
-  const listItem = store.state.listRef.current[activeIndex];
-  if (listItem) {
-    store.state.selectionEventRef.current = nativeEvent;
-    listItem.click();
-    store.state.selectionEventRef.current = null;
-  }
-}
+const BOUNDARY_OFFSET = 2;
 
 /**
  * A button that opens the popup.
@@ -1481,14 +1379,20 @@ const ComboboxTrigger = /*#__PURE__*/React__namespace.forwardRef(function Combob
     labelId: fieldLabelId
   } = useCompositeListItem.useLabelableContext();
   const store = useComboboxRootContext();
+  const {
+    filteredItems
+  } = useComboboxDerivedItemsContext();
   const selectionMode = useScrollLock.useStore(store, selectors.selectionMode);
   const comboboxDisabled = useScrollLock.useStore(store, selectors.disabled);
   const readOnly = useScrollLock.useStore(store, selectors.readOnly);
   const required = useScrollLock.useStore(store, selectors.required);
+  const mounted = useScrollLock.useStore(store, selectors.mounted);
+  const popupSideValue = useScrollLock.useStore(store, selectors.popupSide);
   const positionerElement = useScrollLock.useStore(store, selectors.positionerElement);
   const listElement = useScrollLock.useStore(store, selectors.listElement);
   const storedPopupId = useScrollLock.useStore(store, selectors.popupId);
   const triggerProps = useScrollLock.useStore(store, selectors.triggerProps);
+  const triggerElement = useScrollLock.useStore(store, selectors.triggerElement);
   const inputInsidePopup = useScrollLock.useStore(store, selectors.inputInsidePopup);
   const rootId = useScrollLock.useStore(store, selectors.id);
   const comboboxLabelId = useScrollLock.useStore(store, selectors.labelId);
@@ -1501,8 +1405,8 @@ const ComboboxTrigger = /*#__PURE__*/React__namespace.forwardRef(function Combob
   const inputValue = useComboboxInputValueContext();
   const focusTimeout = useScrollLock.useTimeout();
   const disabled = fieldDisabled || comboboxDisabled || disabledProp;
-  const listEmpty = useListEmpty();
-  const popupSide = usePopupSide(store);
+  const listEmpty = filteredItems.length === 0;
+  const popupSide = mounted && positionerElement ? popupSideValue : null;
   useCompositeListItem.useLabelableId({
     id: inputInsidePopup ? idProp : undefined
   });
@@ -1520,6 +1424,18 @@ const ComboboxTrigger = /*#__PURE__*/React__namespace.forwardRef(function Combob
   function trackPointerType(event) {
     currentPointerTypeRef.current = event.pointerType;
   }
+  const domReference = floatingRootContext.useState('domReferenceElement');
+
+  // Update the floating root context to use the trigger element when it differs from the current reference.
+  // This ensures useClick and useTypeahead attach handlers to the correct element.
+  React__namespace.useEffect(() => {
+    if (!inputInsidePopup) {
+      return;
+    }
+    if (triggerElement && triggerElement !== domReference) {
+      floatingRootContext.set('domReferenceElement', triggerElement);
+    }
+  }, [triggerElement, domReference, floatingRootContext, inputInsidePopup]);
   const {
     reference: triggerTypeaheadProps
   } = useCompositeListItem.useTypeahead(floatingRootContext, {
@@ -1530,7 +1446,7 @@ const ComboboxTrigger = /*#__PURE__*/React__namespace.forwardRef(function Combob
     onMatch(index) {
       const nextSelectedValue = store.state.valuesRef.current[index];
       if (nextSelectedValue !== undefined) {
-        store.state.setSelectedValue(nextSelectedValue, useScrollLock.createChangeEventDetails(useScrollLock.none));
+        store.state.setSelectedValue(nextSelectedValue, useScrollLock.createChangeEventDetails('none'));
       }
     }
   });
@@ -1565,7 +1481,7 @@ const ComboboxTrigger = /*#__PURE__*/React__namespace.forwardRef(function Combob
       id,
       tabIndex: inputInsidePopup ? 0 : -1,
       role: inputInsidePopup ? 'combobox' : undefined,
-      'aria-expanded': open,
+      'aria-expanded': open ? 'true' : 'false',
       'aria-haspopup': inputInsidePopup ? 'dialog' : 'listbox',
       'aria-controls': ariaControls,
       'aria-required': inputInsidePopup ? required || undefined : undefined,
@@ -1612,20 +1528,22 @@ const ComboboxTrigger = /*#__PURE__*/React__namespace.forwardRef(function Combob
         }
         const doc = useScrollLock.ownerDocument(event.currentTarget);
         function handleMouseUp(mouseEvent) {
-          const currentTriggerElement = store.state.triggerElement;
-          if (!currentTriggerElement) {
+          if (!triggerElement) {
             return;
           }
           const mouseUpTarget = useScrollLock.getTarget(mouseEvent);
           const positioner = store.state.positionerElement;
           const list = store.state.listElement;
-          if (useScrollLock.contains(currentTriggerElement, mouseUpTarget) || useScrollLock.contains(positioner, mouseUpTarget) || useScrollLock.contains(list, mouseUpTarget)) {
+          if (useScrollLock.contains(triggerElement, mouseUpTarget) || useScrollLock.contains(positioner, mouseUpTarget) || useScrollLock.contains(list, mouseUpTarget) || mouseUpTarget === triggerElement) {
             return;
           }
-          if (useCompositeListItem.isMouseWithinBounds(mouseEvent, currentTriggerElement)) {
+          const bounds = useCompositeListItem.getPseudoElementBounds(triggerElement);
+          const withinHorizontal = mouseEvent.clientX >= bounds.left - BOUNDARY_OFFSET && mouseEvent.clientX <= bounds.right + BOUNDARY_OFFSET;
+          const withinVertical = mouseEvent.clientY >= bounds.top - BOUNDARY_OFFSET && mouseEvent.clientY <= bounds.bottom + BOUNDARY_OFFSET;
+          if (withinHorizontal && withinVertical) {
             return;
           }
-          store.state.setOpen(false, useScrollLock.createChangeEventDetails(useScrollLock.cancelOpen, mouseEvent));
+          store.state.setOpen(false, useScrollLock.createChangeEventDetails('cancel-open', mouseEvent));
         }
         if (inputInsidePopup) {
           doc.addEventListener('mouseup', handleMouseUp, {
@@ -1634,7 +1552,7 @@ const ComboboxTrigger = /*#__PURE__*/React__namespace.forwardRef(function Combob
         }
       },
       onKeyDown(event) {
-        if (readOnly) {
+        if (disabled || readOnly) {
           return;
         }
         if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {
@@ -1643,7 +1561,7 @@ const ComboboxTrigger = /*#__PURE__*/React__namespace.forwardRef(function Combob
           store.state.inputRef.current?.focus();
         }
       }
-    }, validation.getValidationProps(disabled, elementProps), getButtonProps],
+    }, validation ? validation.getValidationProps(disabled, elementProps) : elementProps, getButtonProps],
     stateAttributesMapping: triggerStateAttributesMapping
   });
   return element;
@@ -1718,6 +1636,9 @@ const ComboboxInput = /*#__PURE__*/React__namespace.forwardRef(function Combobox
   const positioning = useComboboxPositionerContext(true);
   const hasPositionerParent = Boolean(positioning);
   const store = useComboboxRootContext();
+  const {
+    filteredItems
+  } = useComboboxDerivedItemsContext();
   // `inputValue` can't be placed in the store.
   // https://github.com/mui/base-ui/issues/2703
   const inputValue = useComboboxInputValueContext();
@@ -1734,16 +1655,19 @@ const ComboboxInput = /*#__PURE__*/React__namespace.forwardRef(function Combobox
   const open = useScrollLock.useStore(store, selectors.open);
   const mounted = useScrollLock.useStore(store, selectors.mounted);
   const selectedValue = useScrollLock.useStore(store, selectors.selectedValue);
+  const popupSideValue = useScrollLock.useStore(store, selectors.popupSide);
+  const positionerElement = useScrollLock.useStore(store, selectors.positionerElement);
   const rootId = useScrollLock.useStore(store, selectors.id);
   const inline = useScrollLock.useStore(store, selectors.inline);
   const modal = useScrollLock.useStore(store, selectors.modal);
   const autoHighlightEnabled = Boolean(autoHighlightMode);
-  const popupSide = usePopupSide(store);
+  const popupSide = mounted && positionerElement ? popupSideValue : null;
   const disabled = fieldDisabled || comboboxDisabled || disabledProp;
-  const listEmpty = useListEmpty();
+  const listEmpty = filteredItems.length === 0;
   const isInsidePopup = hasPositionerParent || inline;
   const focusManagerModal = !isInsidePopup || modal;
   const id = useScrollLock.useBaseUiId(idProp ?? (!isInsidePopup ? rootId : undefined));
+  const ariaLabelledBy = useCompositeListItem.resolveAriaLabelledBy(fieldLabelId, undefined);
   const fieldStateForInput = hasPositionerParent ? useCompositeListItem.DEFAULT_FIELD_STATE_ATTRIBUTES : fieldState;
   const [composingValue, setComposingValue] = React__namespace.useState(null);
   const isComposingRef = React__namespace.useRef(false);
@@ -1761,17 +1685,7 @@ const ComboboxInput = /*#__PURE__*/React__namespace.forwardRef(function Combobox
       inputOwnsFormValue
     });
   });
-  const validationProps = hasPositionerParent ? elementProps : validation.getValidationProps(disabled, elementProps);
-  function clearHighlight() {
-    store.state.setIndices({
-      activeIndex: null,
-      selectedIndex: null,
-      type: store.state.keyboardActiveRef.current ? useScrollLock.keyboard : useScrollLock.pointer
-    });
-  }
-  function markPointerActive() {
-    store.state.keyboardActiveRef.current = false;
-  }
+  const validationProps = hasPositionerParent || !validation ? elementProps : validation.getValidationProps(disabled, elementProps);
   const state = {
     ...fieldStateForInput,
     open,
@@ -1789,7 +1703,9 @@ const ComboboxInput = /*#__PURE__*/React__namespace.forwardRef(function Combobox
       highlightedChipIndex
     } = comboboxChipsContext;
     const renderedChipsCount = comboboxChipsContext.chipsRef.current.length;
-    const [previousChipKey, nextChipKey] = getChipNavigationKeys(direction);
+    const isRtl = direction === 'rtl';
+    const previousChipKey = isRtl ? 'ArrowRight' : 'ArrowLeft';
+    const nextChipKey = isRtl ? 'ArrowLeft' : 'ArrowRight';
     if (highlightedChipIndex !== undefined) {
       if (event.key === previousChipKey) {
         event.preventDefault();
@@ -1808,8 +1724,14 @@ const ComboboxInput = /*#__PURE__*/React__namespace.forwardRef(function Combobox
       } else if (event.key === 'Backspace' || event.key === 'Delete') {
         event.preventDefault();
         // Move highlight appropriately after removal.
-        nextIndex = getIndexAfterChipRemoval(highlightedChipIndex, selectedValue.length);
-        clearHighlight();
+        const computedNextIndex = highlightedChipIndex >= selectedValue.length - 1 ? selectedValue.length - 2 : highlightedChipIndex;
+        // If the computed index is negative, treat it as no highlight.
+        nextIndex = computedNextIndex >= 0 ? computedNextIndex : undefined;
+        store.state.setIndices({
+          activeIndex: null,
+          selectedIndex: null,
+          type: 'keyboard'
+        });
       }
       return nextIndex;
     }
@@ -1818,6 +1740,13 @@ const ComboboxInput = /*#__PURE__*/React__namespace.forwardRef(function Combobox
     if (event.key === previousChipKey && (event.currentTarget.selectionStart ?? 0) === 0 && selectedValue.length > 0) {
       event.preventDefault();
       nextIndex = renderedChipsCount > 0 ? renderedChipsCount - 1 : undefined;
+    } else if (event.key === 'Backspace' && event.currentTarget.value === '' && selectedValue.length > 0) {
+      store.state.setIndices({
+        activeIndex: null,
+        selectedIndex: null,
+        type: 'keyboard'
+      });
+      event.preventDefault();
     }
     return nextIndex;
   }
@@ -1825,10 +1754,11 @@ const ComboboxInput = /*#__PURE__*/React__namespace.forwardRef(function Combobox
     state,
     ref: [forwardedRef, store.state.inputRef, setInputElement],
     props: [inputProps, triggerProps, {
-      value: composingValue ?? inputValue,
+      type: 'text',
+      value: componentProps.value ?? composingValue ?? inputValue,
       'aria-readonly': readOnly || undefined,
       'aria-required': required || undefined,
-      'aria-labelledby': fieldLabelId,
+      'aria-labelledby': ariaLabelledBy,
       disabled,
       readOnly,
       required: selectionMode === 'none' ? required : undefined,
@@ -1883,23 +1813,11 @@ const ComboboxInput = /*#__PURE__*/React__namespace.forwardRef(function Combobox
         store.state.setInputValue(next, useScrollLock.createChangeEventDetails(useScrollLock.inputChange, event.nativeEvent));
       },
       onChange(event) {
-        const nativeEvent = event.nativeEvent;
         // Autofill may not provide `inputType` (Chrome) or may report
         // `insertReplacementText` (Firefox).
-        const inputType = nativeEvent.inputType;
+        const inputType = event.nativeEvent.inputType;
         const autofillLikeInput = !inputType || inputType === 'insertReplacementText';
-        // During composition the input is always considered typed into.
         const shouldOpenOnInput = isComposingRef.current || !autofillLikeInput;
-        function maybeOpenOnInput(trimmed) {
-          if (readOnly || disabled || !trimmed || !shouldOpenOnInput) {
-            return;
-          }
-          store.state.setOpen(true, useScrollLock.createChangeEventDetails(useScrollLock.inputChange, nativeEvent));
-          // When autoHighlight is enabled, keep the highlight (will be set to 0 in root).
-          if (!autoHighlightEnabled) {
-            clearHighlight();
-          }
-        }
 
         // During IME composition, avoid propagating controlled updates to prevent
         // filtering the options prematurely so `Empty` won't show incorrectly.
@@ -1911,23 +1829,38 @@ const ComboboxInput = /*#__PURE__*/React__namespace.forwardRef(function Combobox
           const nextVal = event.currentTarget.value;
           setComposingValue(nextVal);
           if (nextVal === '' && !store.state.openOnInputClick && !store.state.inputInsidePopup) {
-            store.state.setOpen(false, useScrollLock.createChangeEventDetails(useScrollLock.inputClear, nativeEvent));
+            store.state.setOpen(false, useScrollLock.createChangeEventDetails(useScrollLock.inputClear, event.nativeEvent));
           }
           const trimmed = nextVal.trim();
           const shouldMaintainHighlight = autoHighlightEnabled && trimmed !== '';
-          maybeOpenOnInput(trimmed);
+          if (!readOnly && !disabled && trimmed) {
+            if (shouldOpenOnInput) {
+              store.state.setOpen(true, useScrollLock.createChangeEventDetails(useScrollLock.inputChange, event.nativeEvent));
+              if (!autoHighlightEnabled) {
+                store.state.setIndices({
+                  activeIndex: null,
+                  selectedIndex: null,
+                  type: store.state.keyboardActiveRef.current ? 'keyboard' : 'pointer'
+                });
+              }
+            }
+          }
           if (open && store.state.activeIndex !== null && !shouldMaintainHighlight) {
-            clearHighlight();
+            store.state.setIndices({
+              activeIndex: null,
+              selectedIndex: null,
+              type: store.state.keyboardActiveRef.current ? 'keyboard' : 'pointer'
+            });
           }
           return;
         }
-        const inputChangeDetails = useScrollLock.createChangeEventDetails(useScrollLock.inputChange, nativeEvent);
+        const inputChangeDetails = useScrollLock.createChangeEventDetails(useScrollLock.inputChange, event.nativeEvent);
         store.state.setInputValue(event.currentTarget.value, inputChangeDetails);
         if (inputChangeDetails.isCanceled) {
           return;
         }
         const empty = event.currentTarget.value === '';
-        const clearDetails = useScrollLock.createChangeEventDetails(useScrollLock.inputClear, nativeEvent);
+        const clearDetails = useScrollLock.createChangeEventDetails(useScrollLock.inputClear, event.nativeEvent);
         if (empty && !store.state.inputInsidePopup) {
           if (selectionMode === 'single') {
             store.state.setSelectedValue(null, clearDetails);
@@ -1936,13 +1869,30 @@ const ComboboxInput = /*#__PURE__*/React__namespace.forwardRef(function Combobox
             store.state.setOpen(false, clearDetails);
           }
         }
-        maybeOpenOnInput(event.currentTarget.value.trim());
+        const trimmed = event.currentTarget.value.trim();
+        if (!readOnly && !disabled && trimmed) {
+          if (shouldOpenOnInput) {
+            store.state.setOpen(true, useScrollLock.createChangeEventDetails(useScrollLock.inputChange, event.nativeEvent));
+            // When autoHighlight is enabled, keep the highlight (will be set to 0 in root).
+            if (!autoHighlightEnabled) {
+              store.state.setIndices({
+                activeIndex: null,
+                selectedIndex: null,
+                type: store.state.keyboardActiveRef.current ? 'keyboard' : 'pointer'
+              });
+            }
+          }
+        }
 
         // When the user types, ensure the list resets its highlight so that
         // virtual focus returns to the input (aria-activedescendant is
         // cleared).
         if (open && store.state.activeIndex !== null && !autoHighlightEnabled) {
-          clearHighlight();
+          store.state.setIndices({
+            activeIndex: null,
+            selectedIndex: null,
+            type: store.state.keyboardActiveRef.current ? 'keyboard' : 'pointer'
+          });
         }
       },
       onKeyDown(event) {
@@ -1988,7 +1938,11 @@ const ComboboxInput = /*#__PURE__*/React__namespace.forwardRef(function Combobox
           const removalIndex = renderedChipsCount > 0 ? renderedChipsCount - 1 : selectedValue.length - 1;
           const newValue = selectedValue.filter((_, index) => index !== removalIndex);
           // If the removed item was also the active (highlighted) item, clear highlight
-          clearHighlight();
+          store.state.setIndices({
+            activeIndex: null,
+            selectedIndex: null,
+            type: store.state.keyboardActiveRef.current ? 'keyboard' : 'pointer'
+          });
           store.state.setSelectedValue(newValue, useScrollLock.createChangeEventDetails(useScrollLock.none, event.nativeEvent));
           return;
         }
@@ -2018,11 +1972,20 @@ const ComboboxInput = /*#__PURE__*/React__namespace.forwardRef(function Combobox
             return;
           }
           useScrollLock.stopEvent(event);
-          clickHighlightedItem(store, activeIndex, nativeEvent);
+          const listItem = store.state.listRef.current[activeIndex];
+          if (listItem) {
+            store.state.selectionEventRef.current = nativeEvent;
+            listItem.click();
+            store.state.selectionEventRef.current = null;
+          }
         }
       },
-      onPointerMove: markPointerActive,
-      onPointerDown: markPointerActive
+      onPointerMove() {
+        store.state.keyboardActiveRef.current = false;
+      },
+      onPointerDown() {
+        store.state.keyboardActiveRef.current = false;
+      }
     }, validationProps],
     stateAttributesMapping: triggerStateAttributesMapping
   });
@@ -2043,7 +2006,7 @@ function handleInputPress(event, store, disabled, readOnly, shouldIgnoreTarget)
     return;
   }
   const target = useScrollLock.getTarget(event.nativeEvent);
-  const targetElement = useScrollLock.isElement(target) ? target : null;
+  const targetElement = floatingUi_utils.isElement(target) ? target : null;
   if (targetElement !== event.currentTarget && (shouldIgnoreTarget?.(targetElement) || useScrollLock.isInteractiveElement(targetElement))) {
     return;
   }
@@ -2074,14 +2037,20 @@ const ComboboxInputGroup = /*#__PURE__*/React__namespace.forwardRef(function Com
     state: fieldState
   } = useCompositeListItem.useFieldRootContext();
   const store = useComboboxRootContext();
+  const {
+    filteredItems
+  } = useComboboxDerivedItemsContext();
   const open = useScrollLock.useStore(store, selectors.open);
+  const mounted = useScrollLock.useStore(store, selectors.mounted);
+  const popupSideValue = useScrollLock.useStore(store, selectors.popupSide);
+  const positionerElement = useScrollLock.useStore(store, selectors.positionerElement);
   const comboboxDisabled = useScrollLock.useStore(store, selectors.disabled);
   const readOnly = useScrollLock.useStore(store, selectors.readOnly);
   const hasSelectedValue = useScrollLock.useStore(store, selectors.hasSelectedValue);
   const selectionMode = useScrollLock.useStore(store, selectors.selectionMode);
-  const popupSide = usePopupSide(store);
+  const popupSide = mounted && positionerElement ? popupSideValue : null;
   const disabled = comboboxDisabled;
-  const listEmpty = useListEmpty();
+  const listEmpty = filteredItems.length === 0;
   const placeholder = selectionMode === 'none' ? false : !hasSelectedValue;
   const state = {
     ...fieldState,
@@ -2217,21 +2186,19 @@ const ComboboxClear = /*#__PURE__*/React__namespace.forwardRef(function Combobox
         if (disabled || readOnly) {
           return;
         }
-        const type = store.state.keyboardActiveRef.current ? useScrollLock.keyboard : useScrollLock.pointer;
+        const keyboardActiveRef = store.state.keyboardActiveRef;
         store.state.setInputValue('', useScrollLock.createChangeEventDetails(useScrollLock.clearPress, event.nativeEvent));
         if (selectionMode !== 'none') {
           store.state.setSelectedValue(Array.isArray(selectedValue) ? [] : null, useScrollLock.createChangeEventDetails(useScrollLock.clearPress, event.nativeEvent));
-          // A distinct object shape: `Store.update` iterates own keys, so passing an explicit
-          // `selectedIndex: undefined` would overwrite the state instead of leaving it alone.
           store.state.setIndices({
             activeIndex: null,
             selectedIndex: null,
-            type
+            type: keyboardActiveRef.current ? 'keyboard' : 'pointer'
           });
         } else {
           store.state.setIndices({
             activeIndex: null,
-            type
+            type: keyboardActiveRef.current ? 'keyboard' : 'pointer'
           });
         }
         store.state.inputRef.current?.focus();
@@ -2275,6 +2242,9 @@ function ComboboxCollection(props) {
   } = useComboboxDerivedItemsContext();
   const groupContext = useGroupCollectionContext();
   const itemsToRender = groupContext ? groupContext.items : filteredItems;
+  if (!itemsToRender) {
+    return null;
+  }
   return /*#__PURE__*/jsxRuntime.jsx(React__namespace.Fragment, {
     children: itemsToRender.map(children)
   });
@@ -2298,7 +2268,7 @@ const ComboboxList = /*#__PURE__*/React__namespace.forwardRef(function ComboboxL
   } = useComboboxDerivedItemsContext();
   const selectionMode = useScrollLock.useStore(store, selectors.selectionMode);
   const grid = useScrollLock.useStore(store, selectors.grid);
-  const listProps = useScrollLock.useStore(store, selectors.listProps);
+  const popupProps = useScrollLock.useStore(store, selectors.popupProps);
   const virtualized = useScrollLock.useStore(store, selectors.virtualized);
   const forceMounted = useScrollLock.useStore(store, selectors.forceMounted);
   const multiple = selectionMode === 'multiple';
@@ -2312,7 +2282,7 @@ const ComboboxList = /*#__PURE__*/React__namespace.forwardRef(function ComboboxL
 
   // Support "closed template" API: if children is a function, implicitly wrap it
   // with a Combobox.Collection that reads items from context/root.
-  // Ensures this component's `listProps` subscription does not cause <Combobox.Item>
+  // Ensures this component's `popupProps` subscription does not cause <Combobox.Item>
   // to re-render on every active index change.
   const resolvedChildren = React__namespace.useMemo(() => {
     if (typeof children === 'function') {
@@ -2329,7 +2299,7 @@ const ComboboxList = /*#__PURE__*/React__namespace.forwardRef(function ComboboxL
   const element = useRenderElement.useRenderElement('div', componentProps, {
     state,
     ref: [forwardedRef, setListElement, hasPositionerContext ? null : setPositionerElement],
-    props: [listProps, {
+    props: [popupProps, {
       children: resolvedChildren,
       tabIndex: -1,
       id: floatingId,
@@ -2346,7 +2316,13 @@ const ComboboxList = /*#__PURE__*/React__namespace.forwardRef(function ComboboxL
             return;
           }
           useScrollLock.stopEvent(event);
-          clickHighlightedItem(store, activeIndex, event.nativeEvent);
+          const nativeEvent = event.nativeEvent;
+          const listItem = store.state.listRef.current[activeIndex];
+          if (listItem) {
+            store.state.selectionEventRef.current = nativeEvent;
+            listItem.click();
+            store.state.selectionEventRef.current = null;
+          }
         }
       },
       onKeyDownCapture() {
@@ -2405,7 +2381,7 @@ function useInitialLiveRegionTextMutation() {
     if (textNode == null) {
       return undefined;
     }
-    const originalValue = textNode.data;
+    const originalValue = textNode.nodeValue ?? '';
     const markedValue = `${originalValue}${LIVE_REGION_MARKER}`;
     textNode.nodeValue = markedValue;
     timeout.start(INITIAL_LIVE_REGION_TEXT_MUTATION_RESET_DELAY, () => {
@@ -2534,23 +2510,24 @@ const ComboboxPositioner = /*#__PURE__*/React__namespace.forwardRef(function Com
     render,
     className,
     anchor,
-    // `useAnchorPositioning` applies the same defaults to the undefined values; the names
-    // remain destructured to exclude the props from `elementProps`.
-    positionMethod,
-    side,
-    align,
-    sideOffset,
-    alignOffset,
+    positionMethod = 'absolute',
+    side = 'bottom',
+    align = 'center',
+    sideOffset = 0,
+    alignOffset = 0,
     collisionBoundary = 'clipping-ancestors',
-    collisionPadding,
-    arrowPadding,
-    sticky,
+    collisionPadding = 5,
+    arrowPadding = 5,
+    sticky = false,
     disableAnchorTracking = false,
     collisionAvoidance = useScrollLock.DROPDOWN_COLLISION_AVOIDANCE,
     style: styleProp,
     ...elementProps
   } = componentProps;
   const store = useComboboxRootContext();
+  const {
+    filteredItems
+  } = useComboboxDerivedItemsContext();
   const floatingRootContext = useComboboxFloatingContext();
   const keepMounted = useComboboxPortalContext();
   const modal = useScrollLock.useStore(store, selectors.modal);
@@ -2563,7 +2540,7 @@ const ComboboxPositioner = /*#__PURE__*/React__namespace.forwardRef(function Com
   const inputGroupElement = useScrollLock.useStore(store, selectors.inputGroupElement);
   const inputInsidePopup = useScrollLock.useStore(store, selectors.inputInsidePopup);
   const transitionStatus = useScrollLock.useStore(store, selectors.transitionStatus);
-  const empty = useListEmpty();
+  const empty = filteredItems.length === 0;
   const resolvedAnchor = anchor ?? (inputInsidePopup ? triggerElement : inputGroupElement ?? inputElement);
   const positioning = useCompositeListItem.useAnchorPositioning({
     anchor: resolvedAnchor,
@@ -2638,16 +2615,18 @@ const ComboboxPopup = /*#__PURE__*/React__namespace.forwardRef(function Combobox
   const store = useComboboxRootContext();
   const positioning = useComboboxPositionerContext();
   const floatingRootContext = useComboboxFloatingContext();
+  const {
+    filteredItems
+  } = useComboboxDerivedItemsContext();
   const mounted = useScrollLock.useStore(store, selectors.mounted);
   const open = useScrollLock.useStore(store, selectors.open);
   const openMethod = useScrollLock.useStore(store, selectors.openMethod);
-  const popupProps = useScrollLock.useStore(store, selectors.popupProps);
   const transitionStatus = useScrollLock.useStore(store, selectors.transitionStatus);
   const inputInsidePopup = useScrollLock.useStore(store, selectors.inputInsidePopup);
   const inputElement = useScrollLock.useStore(store, selectors.inputElement);
   const modal = useScrollLock.useStore(store, selectors.modal);
   const rootId = useScrollLock.useStore(store, selectors.id);
-  const empty = useListEmpty();
+  const empty = filteredItems.length === 0;
   const popupId = elementProps.id ?? (inputInsidePopup ? getComboboxPopupId(rootId) : undefined);
   useScrollLock.useIsoLayoutEffect(() => {
     // Prefer the rendered DOM id, which a `render` prop element or function may override.
@@ -2676,9 +2655,10 @@ const ComboboxPopup = /*#__PURE__*/React__namespace.forwardRef(function Combobox
   const element = useRenderElement.useRenderElement('div', componentProps, {
     state,
     ref: [forwardedRef, store.state.popupRef],
-    props: [popupProps, {
+    props: [{
       id: popupId,
       role: inputInsidePopup ? 'dialog' : 'presentation',
+      tabIndex: -1,
       onFocus(event) {
         const target = useScrollLock.getTarget(event.nativeEvent);
         if (openMethod !== 'touch' && (useScrollLock.contains(store.state.listElement, target) || target === event.currentTarget)) {
@@ -2825,7 +2805,7 @@ const ComboboxGroupLabel = /*#__PURE__*/React__namespace.forwardRef(function Com
   useScrollLock.useIsoLayoutEffect(() => {
     setLabelId(id);
     return () => {
-      setLabelId(currentId => currentId === id ? undefined : currentId);
+      setLabelId(undefined);
     };
   }, [id, setLabelId]);
   const element = useRenderElement.useRenderElement('div', componentProps, {
@@ -2867,27 +2847,27 @@ function ComboboxItemInner(props) {
     style,
     value: itemValue = null,
     index: indexProp,
-    disabled: disabledProp = false,
+    disabled = false,
     nativeButton = false,
     ...elementProps
   } = componentProps;
+  const didPointerDownRef = React__namespace.useRef(false);
   const textRef = React__namespace.useRef(null);
   const listItem = useCompositeListItem.useCompositeListItem({
-    guess: true,
     index: indexProp,
-    textRef
+    textRef,
+    indexGuessBehavior: useCompositeListItem.IndexGuessBehavior.GuessFromOrder
   });
   const store = useComboboxRootContext();
   const isRow = useComboboxRowContext();
   const hasItems = useComboboxHasItemsContext();
+  const open = useScrollLock.useStore(store, selectors.open);
   const selectionMode = useScrollLock.useStore(store, selectors.selectionMode);
-  const rootDisabled = useScrollLock.useStore(store, selectors.disabled);
   const readOnly = useScrollLock.useStore(store, selectors.readOnly);
   const isItemEqualToValue = useScrollLock.useStore(store, selectors.isItemEqualToValue);
-  const disabled = rootDisabled || disabledProp;
   const selectable = selectionMode !== 'none';
-  const index = indexProp ?? indexFromFilter ?? listItem.index;
-  const hasRegistered = index !== -1;
+  const index = indexProp ?? (virtualized ? indexFromFilter ?? -1 : listItem.index);
+  const hasRegistered = listItem.index !== -1;
   const rootId = useScrollLock.useStore(store, selectors.id);
   const highlighted = useScrollLock.useStore(store, selectors.isActive, index);
   const matchesSelectedValue = useScrollLock.useStore(store, selectors.isSelected, itemValue);
@@ -2912,24 +2892,31 @@ function ComboboxItemInner(props) {
     }
     const visibleMap = store.state.valuesRef.current;
     visibleMap[index] = itemValue;
+
+    // Stable registry that doesn't depend on filtering. Assume that no
+    // filtering had occurred at this point; otherwise, an `items` prop is
+    // required.
+    if (selectionMode !== 'none') {
+      store.state.allValuesRef.current.push(itemValue);
+    }
     return () => {
       delete visibleMap[index];
     };
-  }, [hasRegistered, hasItems, index, itemValue, store]);
+  }, [hasRegistered, hasItems, index, itemValue, store, selectionMode]);
   useScrollLock.useIsoLayoutEffect(() => {
+    if (!open) {
+      didPointerDownRef.current = false;
+      return;
+    }
     if (!hasRegistered || hasItems) {
       return;
     }
-
-    // Runs while closed as well (the list can stay mounted via `keepMounted` or a
-    // force-mount) so the index tracks the item's composite position, keeping features
-    // like closed-trigger typeahead in sync when the rendered order changes.
     const selectedValue = store.state.selectedValue;
     const lastSelectedValue = Array.isArray(selectedValue) ? selectedValue[selectedValue.length - 1] : selectedValue;
     if (useCompositeListItem.compareItemEquality(itemValue, lastSelectedValue, isItemEqualToValue)) {
       store.set('selectedIndex', index);
     }
-  }, [hasRegistered, hasItems, store, index, itemValue, isItemEqualToValue]);
+  }, [hasRegistered, hasItems, open, store, index, itemValue, isItemEqualToValue]);
   const {
     getButtonProps,
     buttonRef
@@ -2964,12 +2951,7 @@ function ComboboxItemInner(props) {
     // as it should be a `<div>` instead.
     tabIndex: undefined,
     onPointerDownCapture(event) {
-      // The compat `mouseup` only fires for the primary pointer, so a non-primary
-      // touch must not overwrite the shared ref — a mismatch would make the primary
-      // pointer's release read as a drag-select and commit a second time after `click`.
-      if (event.isPrimary) {
-        store.state.pointerDownItemRef.current = event.currentTarget;
-      }
+      didPointerDownRef.current = true;
       event.preventDefault();
     },
     onMouseDown(event) {
@@ -2984,8 +2966,8 @@ function ComboboxItemInner(props) {
       commitSelection(event.nativeEvent);
     },
     onMouseUp(event) {
-      const pointerStartedOnItem = store.state.pointerDownItemRef.current === event.currentTarget;
-      store.state.pointerDownItemRef.current = null;
+      const pointerStartedOnItem = didPointerDownRef.current;
+      didPointerDownRef.current = false;
       if (disabled || readOnly || event.button !== 0 || pointerStartedOnItem || !highlighted) {
         return;
       }
@@ -3121,33 +3103,6 @@ const ComboboxEmpty = /*#__PURE__*/React__namespace.forwardRef(function Combobox
 });
 if (process.env.NODE_ENV !== "production") ComboboxEmpty.displayName = "ComboboxEmpty";
 
-/**
- * A visual separator between items.
- * Renders a `<div>` element.
- *
- * @internal
- */
-const ListboxSeparator = /*#__PURE__*/React__namespace.forwardRef(function ListboxSeparator(componentProps, forwardedRef) {
-  const {
-    className,
-    render,
-    orientation = 'horizontal',
-    style,
-    ...elementProps
-  } = componentProps;
-  const state = {
-    orientation
-  };
-  return useRenderElement.useRenderElement('div', componentProps, {
-    state,
-    ref: forwardedRef,
-    props: [{
-      role: 'presentation'
-    }, elementProps]
-  });
-});
-if (process.env.NODE_ENV !== "production") ListboxSeparator.displayName = "ListboxSeparator";
-
 /**
  * Returns the internally filtered items.
  */
@@ -3214,8 +3169,7 @@ const ComboboxLabel = /*#__PURE__*/React__namespace.forwardRef(function Combobox
     id: defaultLabelId,
     fallbackControlId: localControlId,
     setLabelId(nextLabelId) {
-      const resolvedLabelId = typeof nextLabelId === 'function' ? nextLabelId(store.state.labelId) : nextLabelId;
-      store.set('labelId', resolvedLabelId);
+      store.set('labelId', nextLabelId);
     }
   });
   return useRenderElement.useRenderElement('div', componentProps, {
@@ -3258,10 +3212,11 @@ function ComboboxValue(props) {
 }
 
 const ComboboxItemIndicator = /*#__PURE__*/React__namespace.forwardRef(function ComboboxItemIndicator(componentProps, forwardedRef) {
+  const keepMounted = componentProps.keepMounted ?? false;
   const {
     selected
   } = useComboboxItemContext();
-  const shouldRender = componentProps.keepMounted || selected;
+  const shouldRender = keepMounted || selected;
   if (!shouldRender) {
     return null;
   }
@@ -3391,7 +3346,9 @@ const ComboboxChip = /*#__PURE__*/React__namespace.forwardRef(function ComboboxC
   } = useCompositeListItem.useCompositeListItem();
   function handleKeyDown(event) {
     let nextIndex = index;
-    const [previousChipKey, nextChipKey] = getChipNavigationKeys(direction);
+    const isRtl = direction === 'rtl';
+    const previousChipKey = isRtl ? 'ArrowRight' : 'ArrowLeft';
+    const nextChipKey = isRtl ? 'ArrowLeft' : 'ArrowRight';
     if (event.key === previousChipKey) {
       event.preventDefault();
       if (index > 0) {
@@ -3407,12 +3364,13 @@ const ComboboxChip = /*#__PURE__*/React__namespace.forwardRef(function ComboboxC
         nextIndex = undefined;
       }
     } else if (event.key === 'Backspace' || event.key === 'Delete') {
-      nextIndex = getIndexAfterChipRemoval(index, selectedValue.length);
+      const computedNextIndex = index >= selectedValue.length - 1 ? selectedValue.length - 2 : index;
+      nextIndex = computedNextIndex >= 0 ? computedNextIndex : undefined;
       useScrollLock.stopEvent(event);
       store.state.setIndices({
         activeIndex: null,
         selectedIndex: null,
-        type: useScrollLock.keyboard
+        type: 'keyboard'
       });
       store.state.setSelectedValue(selectedValue.filter((_, i) => i !== index), useScrollLock.createChangeEventDetails(useScrollLock.none, event.nativeEvent));
     } else if (event.key === 'Enter' || event.key === ' ') {
@@ -3512,7 +3470,7 @@ const ComboboxChipRemove = /*#__PURE__*/React__namespace.forwardRef(function Com
     if (removedIndex !== -1 && activeIndex === removedIndex) {
       store.state.setIndices({
         activeIndex: null,
-        type: store.state.keyboardActiveRef.current ? useScrollLock.keyboard : useScrollLock.pointer
+        type: store.state.keyboardActiveRef.current ? 'keyboard' : 'pointer'
       });
     }
   }
@@ -3533,12 +3491,18 @@ const ComboboxChipRemove = /*#__PURE__*/React__namespace.forwardRef(function Com
         event.preventDefault();
       },
       onClick(event) {
+        if (disabled || readOnly) {
+          return;
+        }
         const eventDetails = removeChip(event);
         if (!eventDetails.isPropagationAllowed) {
           event.stopPropagation();
         }
       },
       onKeyDown(event) {
+        if (disabled || readOnly) {
+          return;
+        }
         if (event.key === 'Enter' || event.key === ' ') {
           const eventDetails = removeChip(event);
           if (!eventDetails.isPropagationAllowed) {
@@ -3552,14 +3516,6 @@ const ComboboxChipRemove = /*#__PURE__*/React__namespace.forwardRef(function Com
 });
 if (process.env.NODE_ENV !== "production") ComboboxChipRemove.displayName = "ComboboxChipRemove";
 
-/**
- * A visual separator between items or groups.
- * Renders a `<div>` element.
- *
- * Documentation: [Base UI Combobox](https://base-ui.com/react/components/combobox)
- */
-const ComboboxSeparator = ListboxSeparator;
-
 exports.AriaCombobox = AriaCombobox;
 exports.ComboboxArrow = ComboboxArrow;
 exports.ComboboxBackdrop = ComboboxBackdrop;
@@ -3583,11 +3539,9 @@ exports.ComboboxPortal = ComboboxPortal;
 exports.ComboboxPositioner = ComboboxPositioner;
 exports.ComboboxRoot = ComboboxRoot;
 exports.ComboboxRow = ComboboxRow;
-exports.ComboboxSeparator = ComboboxSeparator;
 exports.ComboboxStatus = ComboboxStatus;
 exports.ComboboxTrigger = ComboboxTrigger;
 exports.ComboboxValue = ComboboxValue;
-exports.ListboxSeparator = ListboxSeparator;
 exports.useComboboxFilter = useComboboxFilter;
 exports.useComboboxInputValueContext = useComboboxInputValueContext;
 exports.useCoreFilter = useCoreFilter;