@octanejs/base-ui 0.1.15 → 0.1.16

package/src/utils/composite/useCompositeRoot.ts

@@ -141,14 +141,9 @@ export function useCompositeRoot(...args: any[]): {
 
 			if (activeIndex !== -1) {
 				onHighlightedIndexChange(activeIndex);
-			} else if (
-				isListIndexDisabled({ current: sortedElements }, highlightedIndex, disabledIndices)
-			) {
-				const firstEnabledIndex = findNonDisabledListIndex(
-					{ current: sortedElements },
-					{ disabledIndices },
-				);
-				if (!isIndexOutOfListBounds({ current: sortedElements }, firstEnabledIndex)) {
+			} else if (isListIndexDisabled(sortedElements, highlightedIndex, disabledIndices)) {
+				const firstEnabledIndex = findNonDisabledListIndex(sortedElements, { disabledIndices });
+				if (!isIndexOutOfListBounds(sortedElements, firstEnabledIndex)) {
 					onHighlightedIndexChange(firstEnabledIndex);
 				}
 			}
@@ -168,9 +163,9 @@ export function useCompositeRoot(...args: any[]): {
 				return;
 			}
 			const elements = elementsRef.current;
-			if (isListIndexDisabled(elementsRef, highlightedIndex, disabledIndices)) {
-				const firstEnabledIndex = findNonDisabledListIndex(elementsRef, { disabledIndices });
-				if (!isIndexOutOfListBounds({ current: elements }, firstEnabledIndex)) {
+			if (isListIndexDisabled(elements, highlightedIndex, disabledIndices)) {
+				const firstEnabledIndex = findNonDisabledListIndex(elements, { disabledIndices });
+				if (!isIndexOutOfListBounds(elements, firstEnabledIndex)) {
 					onHighlightedIndexChange(firstEnabledIndex);
 				}
 			}
@@ -294,7 +289,7 @@ export function useCompositeRoot(...args: any[]): {
 						nextIndex = onLoop(event, highlightedIndex, nextIndex, elementsRef);
 					}
 				} else {
-					nextIndex = findNonDisabledListIndex(elementsRef, {
+					nextIndex = findNonDisabledListIndex(elementsRef.current, {
 						startingIndex: nextIndex,
 						decrement: backwardKeys.includes(event.key),
 						disabledIndices,
@@ -302,7 +297,10 @@ export function useCompositeRoot(...args: any[]): {
 				}
 			}
 
-			if (nextIndex !== highlightedIndex && !isIndexOutOfListBounds(elementsRef, nextIndex)) {
+			if (
+				nextIndex !== highlightedIndex &&
+				!isIndexOutOfListBounds(elementsRef.current, nextIndex)
+			) {
 				if (stopEventPropagation) {
 					event.stopPropagation();
 				}

package/src/utils/constants.ts

@@ -2,8 +2,30 @@
 // overlay/positioner layer needs. `POPUP_COLLISION_AVOIDANCE` is the default collision config
 // popups pass to `useAnchorPositioning`; `DISABLED_TRANSITIONS_STYLE` disables transitions while
 // a popup is in the `starting` transition phase (so the mount frame doesn't animate).
+
+/**
+ * Used by regular popups that usually aren't scrollable and are allowed to
+ * freely flip to any axis of placement.
+ */
 export const POPUP_COLLISION_AVOIDANCE = {
 	fallbackAxisSide: 'end',
 } as const;
 
+/**
+ * Used for dropdowns that usually strictly prefer top/bottom placements and
+ * use `var(--available-height)` to limit their height.
+ */
+export const DROPDOWN_COLLISION_AVOIDANCE = {
+	fallbackAxisSide: 'none',
+} as const;
+
 export const DISABLED_TRANSITIONS_STYLE = { style: { transition: 'none' } } as const;
+
+/** How long a typeahead buffer survives without a keystroke before it resets. */
+export const TYPEAHEAD_RESET_MS = 500;
+
+/**
+ * How long after a hover-open a click is still treated as "patient" (and therefore does not
+ * immediately close the popup it just opened).
+ */
+export const PATIENT_CLICK_THRESHOLD = 500;

package/src/utils/createChangeEventDetails.ts

@@ -28,8 +28,11 @@ export const REASONS = {
 	outsidePress: 'outside-press',
 	closePress: 'close-press',
 	focusOut: 'focus-out',
+	listNavigation: 'list-navigation',
 	escapeKey: 'escape-key',
 	imperativeAction: 'imperative-action',
+	cancelOpen: 'cancel-open',
+	siblingOpen: 'sibling-open',
 } as const;
 
 export type BaseUIEventReason = (typeof REASONS)[keyof typeof REASONS];

package/src/utils/findRootOwnerId.ts

@@ -0,0 +1,19 @@
+// Ported verbatim from .base-ui/packages/react/src/menu/utils/findRootOwnerId.ts (v1.6.0). Pure —
+// no octane adaptations needed.
+//
+// Walks up from a node to the nearest element carrying `data-rootownerid` (stamped on
+// `Menu.Popup`), so a mouseup landing in ANOTHER popup of the same menu root can be told apart
+// from a mouseup that landed outside the menu tree entirely.
+import { getParentNode, isHTMLElement, isLastTraversableNode } from '@floating-ui/utils/dom';
+
+export function findRootOwnerId(node: Node): string | undefined {
+	if (isHTMLElement(node) && node.hasAttribute('data-rootownerid')) {
+		return node.getAttribute('data-rootownerid') ?? undefined;
+	}
+
+	if (isLastTraversableNode(node)) {
+		return undefined;
+	}
+
+	return findRootOwnerId(getParentNode(node));
+}

package/src/utils/floating/gridNavigation.ts

@@ -0,0 +1,54 @@
+// Ported from .base-ui/packages/react/src/floating-ui-react/hooks/gridNavigation.ts (v1.6.0). The
+// grid navigator `useListNavigation` injects for its own `grid` option — distinct from
+// `../composite/gridNavigation`, which builds the navigator `useCompositeRoot` takes.
+//
+// octane adaptations: the event is the NATIVE `KeyboardEvent`, and `React.RefObject<T>` is a plain
+// `{ current: T }`. Not a hook, so no slot. Upstream's `utils/composite` module is split in this
+// binding: the list algebra lives in `../composite/list-utils`, the grid algorithm in
+// `../composite/grid-utils`.
+import { getGridNavigatedIndex } from '../composite/grid-utils';
+import { isIndexOutOfListBounds, type DisabledIndices } from '../composite/list-utils';
+
+/**
+ * Positional arguments are deliberate: property names of an options object
+ * don't minify, and the signature is locked to the caller via `typeof` on the
+ * `grid` option of `useListNavigation`.
+ *
+ * The injected grid navigator only ever operates on a uniform 1x1 grid (sizes are
+ * always `1x1` and packing is never dense), so the cell-map machinery that supports
+ * multi-cell items collapses to an identity transform over the item list. Calling
+ * `getGridNavigatedIndex` directly keeps the cell-map helpers
+ * (`createGridCellMap`/`getGridCellIndexOfCorner`/`getGridCellIndices`) out of
+ * grid-combobox bundles.
+ */
+export function gridNavigation(
+	event: KeyboardEvent,
+	prevIndex: number,
+	listRef: { current: Array<HTMLElement | null> },
+	orientation: 'horizontal' | 'vertical' | 'both',
+	loopFocus: boolean,
+	rtl: boolean,
+	disabledIndices: DisabledIndices | undefined,
+	minIndex: number,
+	maxIndex: number,
+	cols = 2,
+): number | undefined {
+	const nextIndex = getGridNavigatedIndex(listRef.current, {
+		event,
+		orientation,
+		loopFocus,
+		rtl,
+		cols,
+		disabledIndices,
+		minIndex,
+		maxIndex,
+		// An out-of-range previous index falls back to the first enabled item.
+		prevIndex: prevIndex > maxIndex ? minIndex : prevIndex,
+		stopEvent: true,
+	});
+
+	// `getGridNavigatedIndex` can return an out-of-bounds sentinel (e.g. `-1` when there is no
+	// previous item to move from); surface that as `undefined` so the caller treats it as
+	// "no navigation" rather than highlighting index `-1`.
+	return isIndexOutOfListBounds(listRef.current, nextIndex) ? undefined : nextIndex;
+}