@base-ui/react 1.6.0 → 1.7.0

package/internals/composite/list/CompositeList.mjs

@@ -9,7 +9,6 @@ import { CompositeListContext } from "./CompositeListContext.mjs";
 import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * Provides context for a list of items in a composite component.
- * @internal
  */
 export function CompositeList(props) {
   const {
@@ -19,116 +18,146 @@ export function CompositeList(props) {
     onMapChange: onMapChangeProp
   } = props;
   const onMapChange = useStableCallback(onMapChangeProp);
-  const nextIndexRef = React.useRef(0);
+  const [, setMapTick] = React.useState(false);
   const listeners = useRefWithInit(createListeners).current;
-
-  // We use a stable `map` to avoid O(n^2) re-allocation costs for large lists.
-  // `mapTick` is our re-render trigger mechanism. We also need to update the
-  // elements and label refs, but there's a lot of async work going on and sometimes
-  // the effect that handles `onMapChange` gets called after those refs have been
-  // filled, and we don't want to lose those values by setting their lengths to `0`.
-  // We also need to have them at the proper length because floating-ui uses that
-  // information for list navigation.
-
   const map = useRefWithInit(createMap).current;
-  // `mapTick` uses a counter rather than objects for low precision-loss risk and better memory efficiency
-  const [mapTick, setMapTick] = React.useState(0);
-  const lastTickRef = React.useRef(mapTick);
-  const register = useStableCallback((node, metadata) => {
-    map.set(node, metadata ?? null);
-    lastTickRef.current += 1;
-    setMapTick(lastTickRef.current);
+  const nextIndexRef = React.useRef(0);
+  const isDirtyRef = React.useRef(true);
+  const itemsRef = React.useRef([]);
+  const mutationObserverRef = React.useRef(null);
+
+  // Item effects can run without their parent rendering. Schedule one synchronous
+  // parent update for the whole commit so refs are rebuilt before paint and while
+  // the originating React event is still inside `act()` in tests.
+  const scheduleMapUpdate = useStableCallback(() => {
+    if (isDirtyRef.current) {
+      return;
+    }
+    isDirtyRef.current = true;
+    setMapTick(tick => !tick);
+  });
+  const register = useStableCallback((node, registration) => {
+    map.set(node, registration);
+    scheduleMapUpdate();
   });
   const unregister = useStableCallback(node => {
     map.delete(node);
-    lastTickRef.current += 1;
-    setMapTick(lastTickRef.current);
+    scheduleMapUpdate();
   });
-  const sortedMap = React.useMemo(() => {
-    // `mapTick` is the `useMemo` trigger as `map` is stable.
-    disableEslintWarning(mapTick);
-    const newMap = new Map();
-    // Filter out disconnected elements before sorting to avoid inconsistent
-    // compareDocumentPosition results when elements are detached from the DOM.
-    const sortedNodes = Array.from(map.keys()).filter(node => node.isConnected).sort(sortByDocumentPosition);
-    sortedNodes.forEach((node, index) => {
-      const metadata = map.get(node) ?? {};
-      newMap.set(node, {
-        ...metadata,
-        index
+  const syncRefs = useStableCallback(items => {
+    const nextMap = new Map();
+    elementsRef.current.length = 0;
+    if (labelsRef) {
+      labelsRef.current.length = 0;
+    }
+    items.forEach(item => {
+      nextMap.set(item.element, {
+        ...(item.registration.metadata ?? {}),
+        index: item.index
       });
+      elementsRef.current[item.index] = item.element;
+      if (labelsRef) {
+        labelsRef.current[item.index] = item.registration.label !== undefined ? item.registration.label : item.registration.textRef?.current?.textContent ?? item.element.textContent;
+      }
     });
-    return newMap;
-  }, [map, mapTick]);
-  useIsoLayoutEffect(() => {
-    if (typeof MutationObserver !== 'function' || sortedMap.size === 0) {
-      return undefined;
+    nextIndexRef.current = elementsRef.current.length;
+    return nextMap;
+  });
+  function observe(sortedNodes) {
+    mutationObserverRef.current?.disconnect();
+    mutationObserverRef.current = null;
+
+    // A single item can't reorder.
+    if (typeof MutationObserver !== 'function' || sortedNodes.length < 2) {
+      return;
     }
     const mutationObserver = new MutationObserver(entries => {
-      const diff = new Set();
-      const updateDiff = node => diff.has(node) ? diff.delete(node) : diff.add(node);
-      entries.forEach(entry => {
-        entry.removedNodes.forEach(updateDiff);
-        entry.addedNodes.forEach(updateDiff);
-      });
-      if (diff.size === 0) {
-        lastTickRef.current += 1;
-        setMapTick(lastTickRef.current);
+      // Only verify the order after a move: a node that was removed and later
+      // re-added within the same batch. Additions and removals alone can't
+      // change the relative order of the remaining items, and items that mount
+      // or unmount re-sort through `register`/`unregister`.
+      if (!hasMovedNode(entries)) {
+        return;
       }
-    });
-    sortedMap.forEach((_, node) => {
-      if (node.parentElement) {
-        mutationObserver.observe(node.parentElement, {
-          childList: true
-        });
+      let previousConnectedNode = null;
+
+      // If any connected node now appears before the previous connected node,
+      // wrappers/items moved and the index map needs to be rebuilt.
+      for (const node of sortedNodes) {
+        if (!node.isConnected) {
+          continue;
+        }
+        if (previousConnectedNode && sortByDocumentPosition(previousConnectedNode, node) > 0) {
+          mutationObserver.disconnect();
+          scheduleMapUpdate();
+          return;
+        }
+        previousConnectedNode = node;
       }
     });
-    return () => {
-      mutationObserver.disconnect();
-    };
-  }, [sortedMap]);
-  useIsoLayoutEffect(() => {
-    const shouldUpdateLengths = lastTickRef.current === mapTick;
-    if (shouldUpdateLengths) {
-      if (elementsRef.current.length !== sortedMap.size) {
-        elementsRef.current.length = sortedMap.size;
-      }
-      if (labelsRef && labelsRef.current.length !== sortedMap.size) {
-        labelsRef.current.length = sortedMap.size;
+    mutationObserverRef.current = mutationObserver;
+
+    // A reorder that changes item indexes must invert at least one adjacent pair
+    // from the previous sorted order. Observing each pair's common parent catches
+    // both direct item moves and ancestor wrapper moves at the boundary.
+    const roots = new Set();
+    for (let i = 1; i < sortedNodes.length; i += 1) {
+      const root = getCommonAncestor(sortedNodes[i - 1], sortedNodes[i]);
+      if (root) {
+        roots.add(root);
       }
-      nextIndexRef.current = sortedMap.size;
     }
-    onMapChange(sortedMap);
-  }, [onMapChange, sortedMap, elementsRef, labelsRef, mapTick]);
+    roots.forEach(root => mutationObserver.observe(root, {
+      childList: true
+    }));
+  }
+  const flush = useStableCallback(() => {
+    const [items, automaticNodes] = getCompositeListSnapshot(map);
+    const nextMap = syncRefs(items);
+    observe(automaticNodes);
+    itemsRef.current = items;
+    isDirtyRef.current = false;
+    listeners.forEach(listener => listener(nextMap));
+    onMapChange(nextMap);
+  });
   useIsoLayoutEffect(() => {
+    // Re-copy the last committed snapshot when the ref objects change or Strict Mode replays
+    // effects without reattaching callback refs.
+    if (!isDirtyRef.current) {
+      syncRefs(itemsRef.current);
+    }
     return () => {
       elementsRef.current = [];
-    };
-  }, [elementsRef]);
-  useIsoLayoutEffect(() => {
-    return () => {
       if (labelsRef) {
         labelsRef.current = [];
       }
     };
-  }, [labelsRef]);
+  }, [elementsRef, labelsRef, syncRefs]);
+  useIsoLayoutEffect(() => {
+    if (isDirtyRef.current) {
+      flush();
+    }
+  });
+  useIsoLayoutEffect(() => {
+    return () => {
+      mutationObserverRef.current?.disconnect();
+      // React 18 Strict Mode replays effects without replaying callback refs.
+      // Mark the retained map dirty so the replay rebuilds refs and observation.
+      isDirtyRef.current = true;
+    };
+  }, []);
   const subscribeMapChange = useStableCallback(fn => {
     listeners.add(fn);
     return () => {
       listeners.delete(fn);
     };
   });
-  useIsoLayoutEffect(() => {
-    listeners.forEach(l => l(sortedMap));
-  }, [listeners, sortedMap]);
   const contextValue = React.useMemo(() => ({
     register,
     unregister,
     subscribeMapChange,
-    elementsRef,
-    labelsRef,
     nextIndexRef
-  }), [register, unregister, subscribeMapChange, elementsRef, labelsRef, nextIndexRef]);
+  }), [register, unregister, subscribeMapChange, nextIndexRef]);
   return /*#__PURE__*/_jsx(CompositeListContext.Provider, {
     value: contextValue,
     children: children
@@ -140,14 +169,64 @@ function createMap() {
 function createListeners() {
   return new Set();
 }
-function sortByDocumentPosition(a, b) {
-  const position = a.compareDocumentPosition(b);
-  if (position & Node.DOCUMENT_POSITION_FOLLOWING || position & Node.DOCUMENT_POSITION_CONTAINED_BY) {
-    return -1;
+function getCompositeListSnapshot(map) {
+  const reservedIndices = new Set();
+  const items = [];
+  const automaticItems = [];
+  map.forEach((registration, node) => {
+    if (!node.isConnected) {
+      return;
+    }
+    const index = registration.index;
+    const item = {
+      index: index ?? -1,
+      element: node,
+      registration
+    };
+    if (index === null) {
+      automaticItems.push(item);
+    } else if (index >= 0) {
+      reservedIndices.add(index);
+      items.push(item);
+    }
+  });
+  let nextAutomaticIndex = 0;
+  automaticItems.sort((a, b) => sortByDocumentPosition(a.element, b.element));
+  automaticItems.forEach(item => {
+    while (reservedIndices.has(nextAutomaticIndex)) {
+      nextAutomaticIndex += 1;
+    }
+    item.index = nextAutomaticIndex;
+    items.push(item);
+    nextAutomaticIndex += 1;
+  });
+  if (reservedIndices.size > 0) {
+    items.sort((a, b) => a.index - b.index);
+  }
+  return [items, automaticItems.map(item => item.element)];
+}
+function getCommonAncestor(firstNode, lastNode) {
+  let ancestor = firstNode.parentElement;
+
+  // The `parentElement` walk cannot cross shadow boundaries, so the native
+  // `contains` is sufficient here.
+  while (ancestor && !ancestor.contains(lastNode)) {
+    ancestor = ancestor.parentElement;
   }
-  if (position & Node.DOCUMENT_POSITION_PRECEDING || position & Node.DOCUMENT_POSITION_CONTAINS) {
-    return 1;
+  return ancestor;
+}
+function hasMovedNode(entries) {
+  for (const entry of entries) {
+    for (let i = 0; i < entry.removedNodes.length; i += 1) {
+      if (entry.removedNodes[i].isConnected) {
+        return true;
+      }
+    }
   }
-  return 0;
+  return false;
 }
-function disableEslintWarning(_) {}
+function sortByDocumentPosition(a, b) {
+  // `DOCUMENT_POSITION_CONTAINED_BY` is always reported alongside `FOLLOWING`, and `CONTAINS`
+  // alongside `PRECEDING`, so testing `FOLLOWING` alone orders siblings and nested items alike.
+  return a.compareDocumentPosition(b) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1;
+}

package/internals/composite/list/CompositeListContext.d.mts

@@ -1,10 +1,14 @@
 import * as React from 'react';
+export interface CompositeListRegistration<Metadata> {
+  metadata: Metadata | null;
+  index: number | null;
+  label: string | null | undefined;
+  textRef: React.RefObject<HTMLElement | null> | undefined;
+}
 export interface CompositeListContextValue<Metadata> {
-  register: (node: Element, metadata: Metadata) => void;
+  register: (node: Element, registration: CompositeListRegistration<Metadata>) => void;
   unregister: (node: Element) => void;
-  subscribeMapChange: (fn: (map: Map<Element, Metadata | null>) => void) => () => void;
-  elementsRef: React.RefObject<Array<HTMLElement | null>>;
-  labelsRef?: React.RefObject<Array<string | null>> | undefined;
+  subscribeMapChange: (fn: (map: Map<Element, Metadata>) => void) => () => void;
   nextIndexRef: React.RefObject<number>;
 }
 export declare const CompositeListContext: React.Context<CompositeListContextValue<any>>;

package/internals/composite/list/CompositeListContext.d.ts

@@ -1,10 +1,14 @@
 import * as React from 'react';
+export interface CompositeListRegistration<Metadata> {
+  metadata: Metadata | null;
+  index: number | null;
+  label: string | null | undefined;
+  textRef: React.RefObject<HTMLElement | null> | undefined;
+}
 export interface CompositeListContextValue<Metadata> {
-  register: (node: Element, metadata: Metadata) => void;
+  register: (node: Element, registration: CompositeListRegistration<Metadata>) => void;
   unregister: (node: Element) => void;
-  subscribeMapChange: (fn: (map: Map<Element, Metadata | null>) => void) => () => void;
-  elementsRef: React.RefObject<Array<HTMLElement | null>>;
-  labelsRef?: React.RefObject<Array<string | null>> | undefined;
+  subscribeMapChange: (fn: (map: Map<Element, Metadata>) => void) => () => void;
   nextIndexRef: React.RefObject<number>;
 }
 export declare const CompositeListContext: React.Context<CompositeListContextValue<any>>;

package/internals/composite/list/CompositeListContext.js

@@ -11,12 +11,7 @@ var React = _interopRequireWildcard(require("react"));
 const CompositeListContext = exports.CompositeListContext = /*#__PURE__*/React.createContext({
   register: () => {},
   unregister: () => {},
-  subscribeMapChange: () => {
-    return () => {};
-  },
-  elementsRef: {
-    current: []
-  },
+  subscribeMapChange: () => () => {},
   nextIndexRef: {
     current: 0
   }

package/internals/composite/list/CompositeListContext.mjs

@@ -4,12 +4,7 @@ import * as React from 'react';
 export const CompositeListContext = /*#__PURE__*/React.createContext({
   register: () => {},
   unregister: () => {},
-  subscribeMapChange: () => {
-    return () => {};
-  },
-  elementsRef: {
-    current: []
-  },
+  subscribeMapChange: () => () => {},
   nextIndexRef: {
     current: 0
   }

package/internals/composite/list/useCompositeListItem.d.mts

@@ -1,22 +1,25 @@
 import * as React from 'react';
 export interface UseCompositeListItemParameters<Metadata> {
+  /**
+   * Whether to guess the initial index from render order, avoiding a re-render after mount for
+   * flat lists.
+   * @default false
+   */
+  guess?: boolean | undefined;
   index?: number | undefined;
   label?: string | null | undefined;
+  /**
+   * Metadata published with the item. Keep object values referentially stable to avoid
+   * unnecessarily detaching and reattaching the callback ref.
+   */
   metadata?: Metadata | undefined;
+  /** Keep the ref object stable to avoid unnecessarily reattaching the item. */
   textRef?: React.RefObject<HTMLElement | null> | undefined;
-  /** Enables guessing the indexes. This avoids a re-render after mount, which is useful for
-   * large lists. This should be used for lists that are likely flat and vertical, other cases
-   * might trigger a re-render anyway. */
-  indexGuessBehavior?: IndexGuessBehavior | undefined;
 }
 interface UseCompositeListItemReturnValue {
   ref: (node: HTMLElement | null) => void;
   index: number;
 }
-export declare enum IndexGuessBehavior {
-  None = 0,
-  GuessFromOrder = 1,
-}
 /**
  * Used to register a list item and its index (DOM position) in the `CompositeList`.
  */

package/internals/composite/list/useCompositeListItem.d.ts

@@ -1,22 +1,25 @@
 import * as React from 'react';
 export interface UseCompositeListItemParameters<Metadata> {
+  /**
+   * Whether to guess the initial index from render order, avoiding a re-render after mount for
+   * flat lists.
+   * @default false
+   */
+  guess?: boolean | undefined;
   index?: number | undefined;
   label?: string | null | undefined;
+  /**
+   * Metadata published with the item. Keep object values referentially stable to avoid
+   * unnecessarily detaching and reattaching the callback ref.
+   */
   metadata?: Metadata | undefined;
+  /** Keep the ref object stable to avoid unnecessarily reattaching the item. */
   textRef?: React.RefObject<HTMLElement | null> | undefined;
-  /** Enables guessing the indexes. This avoids a re-render after mount, which is useful for
-   * large lists. This should be used for lists that are likely flat and vertical, other cases
-   * might trigger a re-render anyway. */
-  indexGuessBehavior?: IndexGuessBehavior | undefined;
 }
 interface UseCompositeListItemReturnValue {
   ref: (node: HTMLElement | null) => void;
   index: number;
 }
-export declare enum IndexGuessBehavior {
-  None = 0,
-  GuessFromOrder = 1,
-}
 /**
  * Used to register a list item and its index (DOM position) in the `CompositeList`.
  */

package/internals/composite/list/useCompositeListItem.js

@@ -5,68 +5,61 @@ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWild
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.IndexGuessBehavior = void 0;
 exports.useCompositeListItem = useCompositeListItem;
 var React = _interopRequireWildcard(require("react"));
 var _useIsoLayoutEffect = require("@base-ui/utils/useIsoLayoutEffect");
 var _CompositeListContext = require("./CompositeListContext");
-let IndexGuessBehavior = exports.IndexGuessBehavior = /*#__PURE__*/function (IndexGuessBehavior) {
-  IndexGuessBehavior[IndexGuessBehavior["None"] = 0] = "None";
-  IndexGuessBehavior[IndexGuessBehavior["GuessFromOrder"] = 1] = "GuessFromOrder";
-  return IndexGuessBehavior;
-}({});
 /**
  * Used to register a list item and its index (DOM position) in the `CompositeList`.
  */
 function useCompositeListItem(params = {}) {
   const {
+    guess,
     label,
     metadata,
     textRef,
-    indexGuessBehavior,
     index: externalIndex
   } = params;
   const {
     register,
     unregister,
     subscribeMapChange,
-    elementsRef,
-    labelsRef,
     nextIndexRef
   } = (0, _CompositeListContext.useCompositeListContext)();
+
+  // Guess the index from the render order. This avoids a re-render after mount for
+  // flat lists rendered in DOM order; when the guess is wrong (grouped or out-of-order
+  // rendering), the commit flush corrects it before paint.
   const indexRef = React.useRef(-1);
-  const [index, setIndex] = React.useState(externalIndex ?? (indexGuessBehavior === IndexGuessBehavior.GuessFromOrder ? () => {
+  const [internalIndex, setInternalIndex] = React.useState(externalIndex == null && guess ? () => {
     if (indexRef.current === -1) {
       const newIndex = nextIndexRef.current;
       nextIndexRef.current += 1;
       indexRef.current = newIndex;
     }
     return indexRef.current;
-  } : -1));
+  } : -1);
+  const index = externalIndex ?? internalIndex;
   const componentRef = React.useRef(null);
+
+  // Deliberately identity-sensitive: nested items sharing one DOM node rely on ref attachment
+  // order to decide which registration wins, and republishing from an effect instead would let
+  // an inner item's later update silently take ownership from the outer one.
   const ref = React.useCallback(node => {
-    componentRef.current = node;
-    if (index !== -1 && node !== null) {
-      elementsRef.current[index] = node;
-      if (labelsRef) {
-        const isLabelDefined = label !== undefined;
-        labelsRef.current[index] = isLabelDefined ? label : textRef?.current?.textContent ?? node.textContent;
-      }
+    const previousNode = componentRef.current;
+    if (previousNode) {
+      unregister(previousNode);
     }
-  }, [index, elementsRef, labelsRef, label, textRef]);
-  (0, _useIsoLayoutEffect.useIsoLayoutEffect)(() => {
-    if (externalIndex != null) {
-      return undefined;
-    }
-    const node = componentRef.current;
+    componentRef.current = node;
     if (node) {
-      register(node, metadata);
-      return () => {
-        unregister(node);
-      };
+      register(node, {
+        metadata: metadata ?? null,
+        index: externalIndex ?? null,
+        label,
+        textRef
+      });
     }
-    return undefined;
-  }, [externalIndex, register, unregister, metadata]);
+  }, [externalIndex, register, unregister, metadata, label, textRef]);
   (0, _useIsoLayoutEffect.useIsoLayoutEffect)(() => {
     if (externalIndex != null) {
       return undefined;
@@ -74,10 +67,10 @@ function useCompositeListItem(params = {}) {
     return subscribeMapChange(map => {
       const i = componentRef.current ? map.get(componentRef.current)?.index : null;
       if (i != null) {
-        setIndex(i);
+        setInternalIndex(i);
       }
     });
-  }, [externalIndex, subscribeMapChange, setIndex]);
+  }, [externalIndex, subscribeMapChange]);
   return {
     ref,
     index

package/internals/composite/list/useCompositeListItem.mjs

@@ -3,64 +3,57 @@
 import * as React from 'react';
 import { useIsoLayoutEffect } from '@base-ui/utils/useIsoLayoutEffect';
 import { useCompositeListContext } from "./CompositeListContext.mjs";
-export let IndexGuessBehavior = /*#__PURE__*/function (IndexGuessBehavior) {
-  IndexGuessBehavior[IndexGuessBehavior["None"] = 0] = "None";
-  IndexGuessBehavior[IndexGuessBehavior["GuessFromOrder"] = 1] = "GuessFromOrder";
-  return IndexGuessBehavior;
-}({});
-
 /**
  * Used to register a list item and its index (DOM position) in the `CompositeList`.
  */
 export function useCompositeListItem(params = {}) {
   const {
+    guess,
     label,
     metadata,
     textRef,
-    indexGuessBehavior,
     index: externalIndex
   } = params;
   const {
     register,
     unregister,
     subscribeMapChange,
-    elementsRef,
-    labelsRef,
     nextIndexRef
   } = useCompositeListContext();
+
+  // Guess the index from the render order. This avoids a re-render after mount for
+  // flat lists rendered in DOM order; when the guess is wrong (grouped or out-of-order
+  // rendering), the commit flush corrects it before paint.
   const indexRef = React.useRef(-1);
-  const [index, setIndex] = React.useState(externalIndex ?? (indexGuessBehavior === IndexGuessBehavior.GuessFromOrder ? () => {
+  const [internalIndex, setInternalIndex] = React.useState(externalIndex == null && guess ? () => {
     if (indexRef.current === -1) {
       const newIndex = nextIndexRef.current;
       nextIndexRef.current += 1;
       indexRef.current = newIndex;
     }
     return indexRef.current;
-  } : -1));
+  } : -1);
+  const index = externalIndex ?? internalIndex;
   const componentRef = React.useRef(null);
+
+  // Deliberately identity-sensitive: nested items sharing one DOM node rely on ref attachment
+  // order to decide which registration wins, and republishing from an effect instead would let
+  // an inner item's later update silently take ownership from the outer one.
   const ref = React.useCallback(node => {
-    componentRef.current = node;
-    if (index !== -1 && node !== null) {
-      elementsRef.current[index] = node;
-      if (labelsRef) {
-        const isLabelDefined = label !== undefined;
-        labelsRef.current[index] = isLabelDefined ? label : textRef?.current?.textContent ?? node.textContent;
-      }
+    const previousNode = componentRef.current;
+    if (previousNode) {
+      unregister(previousNode);
     }
-  }, [index, elementsRef, labelsRef, label, textRef]);
-  useIsoLayoutEffect(() => {
-    if (externalIndex != null) {
-      return undefined;
-    }
-    const node = componentRef.current;
+    componentRef.current = node;
     if (node) {
-      register(node, metadata);
-      return () => {
-        unregister(node);
-      };
+      register(node, {
+        metadata: metadata ?? null,
+        index: externalIndex ?? null,
+        label,
+        textRef
+      });
     }
-    return undefined;
-  }, [externalIndex, register, unregister, metadata]);
+  }, [externalIndex, register, unregister, metadata, label, textRef]);
   useIsoLayoutEffect(() => {
     if (externalIndex != null) {
       return undefined;
@@ -68,10 +61,10 @@ export function useCompositeListItem(params = {}) {
     return subscribeMapChange(map => {
       const i = componentRef.current ? map.get(componentRef.current)?.index : null;
       if (i != null) {
-        setIndex(i);
+        setInternalIndex(i);
       }
     });
-  }, [externalIndex, subscribeMapChange, setIndex]);
+  }, [externalIndex, subscribeMapChange]);
   return {
     ref,
     index

package/internals/composite/root/CompositeRoot.d.mts

@@ -4,9 +4,6 @@ import type { BaseUIComponentProps, BaseUIEvent } from "../../types.mjs";
 import type { ModifierKey } from "../composite.mjs";
 import type { CompositeGridNavigator } from "./gridNavigation.mjs";
 import { StateAttributesMapping } from "../../getStateAttributesProps.mjs";
-/**
- * @internal
- */
 export declare function CompositeRoot<Metadata extends {}, State extends Record<string, any>>(componentProps: CompositeRoot.Props<Metadata, State>): import("react/jsx-runtime").JSX.Element;
 export interface CompositeRootState {}
 export interface CompositeRootProps<Metadata, State extends Record<string, any>> extends Pick<BaseUIComponentProps<'div', State>, 'render' | 'className' | 'children' | 'style'> {
@@ -22,7 +19,7 @@ export interface CompositeRootProps<Metadata, State extends Record<string, any>>
   highlightedIndex?: number | undefined;
   onHighlightedIndexChange?: ((index: number) => void) | undefined;
   enableHomeAndEndKeys?: boolean | undefined;
-  onMapChange?: ((newMap: Map<Node, CompositeMetadata<Metadata> | null>) => void) | undefined;
+  onMapChange?: ((newMap: Map<Node, CompositeMetadata<Metadata>>) => void) | undefined;
   onKeyDown?: ((event: BaseUIEvent<React.KeyboardEvent>) => void) | undefined;
   stopEventPropagation?: boolean | undefined;
   rootRef?: React.RefObject<HTMLElement | null> | undefined;