@burtson-labs/ui 0.13.1 → 0.14.1

package/dist/primitives/vendor/radix/react-select/select.js

@@ -0,0 +1,1040 @@
+"use client";
+import { createContextScope } from "../react-context/create-context.js";
+import { useComposedRefs } from "../react-compose-refs/compose-refs.js";
+import { createSlot } from "../react-slot/slot.js";
+import { createCollection } from "../react-collection/collection-legacy.js";
+import { composeEventHandlers } from "../primitive/primitive.js";
+import { useLayoutEffect } from "../react-use-layout-effect/use-layout-effect.js";
+import { useControllableState } from "../react-use-controllable-state/use-controllable-state.js";
+import { Primitive } from "../react-primitive/primitive.js";
+import { Presence } from "../react-presence/presence.js";
+import { useId } from "../react-id/id.js";
+import { useDirection } from "../react-direction/direction.js";
+import { useCallbackRef } from "../react-use-callback-ref/use-callback-ref.js";
+import { DismissableLayer } from "../react-dismissable-layer/dismissable-layer.js";
+import { FocusScope } from "../react-focus-scope/focus-scope.js";
+import { Portal } from "../react-portal/portal.js";
+import { useFocusGuards } from "../react-focus-guards/focus-guards.js";
+import { Anchor, Content, Root, createPopperScope } from "../react-popper/popper.js";
+import { VISUALLY_HIDDEN_STYLES } from "../react-visually-hidden/visually-hidden.js";
+import { clamp } from "../number/number.js";
+import { usePrevious } from "../react-use-previous/use-previous.js";
+import * as React from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import * as ReactDOM from "react-dom";
+import { RemoveScroll } from "react-remove-scroll";
+import { hideOthers } from "aria-hidden";
+//#region src/primitives/vendor/radix/react-select/select.tsx
+var OPEN_KEYS = [
+	" ",
+	"Enter",
+	"ArrowUp",
+	"ArrowDown"
+];
+var SELECTION_KEYS = [" ", "Enter"];
+var SELECT_NAME = "Select";
+var [Collection, useCollection, createCollectionScope] = createCollection(SELECT_NAME);
+var [createSelectContext, createSelectScope] = createContextScope(SELECT_NAME, [createCollectionScope, createPopperScope]);
+var usePopperScope = createPopperScope();
+var [SelectProviderImpl, useSelectContext] = createSelectContext(SELECT_NAME);
+var [SelectNativeOptionsProvider, useSelectNativeOptionsContext] = createSelectContext(SELECT_NAME);
+function SelectProvider(props) {
+	const { __scopeSelect, children, open: openProp, defaultOpen, onOpenChange, value: valueProp, defaultValue, onValueChange, dir, name, autoComplete, disabled, required, form, internal_do_not_use_render } = props;
+	const popperScope = usePopperScope(__scopeSelect);
+	const [trigger, setTrigger] = React.useState(null);
+	const [valueNode, setValueNode] = React.useState(null);
+	const [valueNodeHasChildren, setValueNodeHasChildren] = React.useState(false);
+	const direction = useDirection(dir);
+	const [open, setOpen] = useControllableState({
+		prop: openProp,
+		defaultProp: defaultOpen ?? false,
+		onChange: onOpenChange,
+		caller: SELECT_NAME
+	});
+	const [value, setValue] = useControllableState({
+		prop: valueProp,
+		defaultProp: defaultValue,
+		onChange: onValueChange,
+		caller: SELECT_NAME
+	});
+	const triggerPointerDownPosRef = React.useRef(null);
+	const initialValueRef = React.useRef(value);
+	React.useEffect(() => {
+		const associatedForm = form ? trigger?.ownerDocument.getElementById(form) : trigger?.form;
+		if (associatedForm instanceof HTMLFormElement) {
+			const reset = () => setValue(initialValueRef.current);
+			associatedForm.addEventListener("reset", reset);
+			return () => associatedForm.removeEventListener("reset", reset);
+		}
+	}, [
+		form,
+		trigger,
+		setValue
+	]);
+	const isFormControl = trigger ? !!form || !!trigger.closest("form") : true;
+	const [nativeOptionsSet, setNativeOptionsSet] = React.useState(/* @__PURE__ */ new Set());
+	const contentId = useId();
+	const nativeSelectKey = Array.from(nativeOptionsSet).map((option) => option.props.value).join(";");
+	const handleNativeOptionAdd = React.useCallback((option) => {
+		setNativeOptionsSet((prev) => new Set(prev).add(option));
+	}, []);
+	const handleNativeOptionRemove = React.useCallback((option) => {
+		setNativeOptionsSet((prev) => {
+			const optionsSet = new Set(prev);
+			optionsSet.delete(option);
+			return optionsSet;
+		});
+	}, []);
+	const context = {
+		required,
+		trigger,
+		onTriggerChange: setTrigger,
+		valueNode,
+		onValueNodeChange: setValueNode,
+		valueNodeHasChildren,
+		onValueNodeHasChildrenChange: setValueNodeHasChildren,
+		contentId,
+		value,
+		onValueChange: setValue,
+		open,
+		onOpenChange: setOpen,
+		dir: direction,
+		triggerPointerDownPosRef,
+		disabled,
+		name,
+		autoComplete,
+		form,
+		nativeOptions: nativeOptionsSet,
+		nativeSelectKey,
+		isFormControl
+	};
+	return /* @__PURE__ */ jsx(Root, {
+		...popperScope,
+		children: /* @__PURE__ */ jsx(SelectProviderImpl, {
+			scope: __scopeSelect,
+			...context,
+			children: /* @__PURE__ */ jsx(Collection.Provider, {
+				scope: __scopeSelect,
+				children: /* @__PURE__ */ jsx(SelectNativeOptionsProvider, {
+					scope: __scopeSelect,
+					onNativeOptionAdd: handleNativeOptionAdd,
+					onNativeOptionRemove: handleNativeOptionRemove,
+					children: isFunction(internal_do_not_use_render) ? internal_do_not_use_render(context) : children
+				})
+			})
+		})
+	});
+}
+var Select = (props) => {
+	const { __scopeSelect, children, ...providerProps } = props;
+	return /* @__PURE__ */ jsx(SelectProvider, {
+		__scopeSelect,
+		...providerProps,
+		internal_do_not_use_render: ({ isFormControl }) => /* @__PURE__ */ jsxs(Fragment, { children: [children, isFormControl ? /* @__PURE__ */ jsx(SelectBubbleInput, { __scopeSelect }) : null] })
+	});
+};
+var TRIGGER_NAME = "SelectTrigger";
+var SelectTrigger = /* @__PURE__ */ React.forwardRef(function SelectTrigger(props, forwardedRef) {
+	const { __scopeSelect, disabled = false, ...triggerProps } = props;
+	const popperScope = usePopperScope(__scopeSelect);
+	const context = useSelectContext(TRIGGER_NAME, __scopeSelect);
+	const isDisabled = context.disabled || disabled;
+	const composedRefs = useComposedRefs(forwardedRef, context.onTriggerChange);
+	const getItems = useCollection(__scopeSelect);
+	const pointerTypeRef = React.useRef("touch");
+	const [searchRef, handleTypeaheadSearch, resetTypeahead] = useTypeaheadSearch((search) => {
+		const enabledItems = getItems().filter((item) => !item.disabled);
+		const nextItem = findNextItem(enabledItems, search, enabledItems.find((item) => item.value === context.value));
+		if (nextItem !== void 0) context.onValueChange(nextItem.value);
+	});
+	const handleOpen = (pointerEvent) => {
+		if (!isDisabled) {
+			context.onOpenChange(true);
+			resetTypeahead();
+		}
+		if (pointerEvent) context.triggerPointerDownPosRef.current = {
+			x: Math.round(pointerEvent.pageX),
+			y: Math.round(pointerEvent.pageY)
+		};
+	};
+	return /* @__PURE__ */ jsx(Anchor, {
+		asChild: true,
+		...popperScope,
+		children: /* @__PURE__ */ jsx(Primitive.button, {
+			type: "button",
+			role: "combobox",
+			"aria-controls": context.open ? context.contentId : void 0,
+			"aria-expanded": context.open,
+			"aria-required": context.required,
+			"aria-autocomplete": "none",
+			dir: context.dir,
+			"data-state": context.open ? "open" : "closed",
+			disabled: isDisabled,
+			"data-disabled": isDisabled ? "" : void 0,
+			"data-placeholder": shouldShowPlaceholder(context.value) ? "" : void 0,
+			...triggerProps,
+			ref: composedRefs,
+			onClick: composeEventHandlers(triggerProps.onClick, (event) => {
+				event.currentTarget.focus();
+				if (pointerTypeRef.current !== "mouse") handleOpen(event);
+			}),
+			onPointerDown: composeEventHandlers(triggerProps.onPointerDown, (event) => {
+				pointerTypeRef.current = event.pointerType;
+				const target = event.target;
+				if (target.hasPointerCapture(event.pointerId)) target.releasePointerCapture(event.pointerId);
+				if (event.button === 0 && event.ctrlKey === false && event.pointerType === "mouse") {
+					handleOpen(event);
+					event.preventDefault();
+				}
+			}),
+			onKeyDown: composeEventHandlers(triggerProps.onKeyDown, (event) => {
+				const isTypingAhead = searchRef.current !== "";
+				if (!(event.ctrlKey || event.altKey || event.metaKey) && event.key.length === 1) handleTypeaheadSearch(event.key);
+				if (isTypingAhead && event.key === " ") return;
+				if (OPEN_KEYS.includes(event.key)) {
+					handleOpen();
+					event.preventDefault();
+				}
+			})
+		})
+	});
+});
+var VALUE_NAME = "SelectValue";
+var SelectValue = /* @__PURE__ */ React.forwardRef(function SelectValue(props, forwardedRef) {
+	const { __scopeSelect, className, style, children, placeholder = "", ...valueProps } = props;
+	const context = useSelectContext(VALUE_NAME, __scopeSelect);
+	const { onValueNodeHasChildrenChange } = context;
+	const hasChildren = children !== void 0;
+	const composedRefs = useComposedRefs(forwardedRef, context.onValueNodeChange);
+	useLayoutEffect(() => {
+		onValueNodeHasChildrenChange(hasChildren);
+	}, [onValueNodeHasChildrenChange, hasChildren]);
+	const showPlaceholder = shouldShowPlaceholder(context.value);
+	return /* @__PURE__ */ jsx(Primitive.span, {
+		...valueProps,
+		asChild: showPlaceholder ? false : valueProps.asChild,
+		ref: composedRefs,
+		style: { pointerEvents: "none" },
+		children: /* @__PURE__ */ jsx(React.Fragment, { children: showPlaceholder ? placeholder : children }, showPlaceholder ? "placeholder" : "value")
+	});
+});
+var SelectIcon = /* @__PURE__ */ React.forwardRef(function SelectIcon(props, forwardedRef) {
+	const { __scopeSelect, children, ...iconProps } = props;
+	return /* @__PURE__ */ jsx(Primitive.span, {
+		"aria-hidden": true,
+		...iconProps,
+		ref: forwardedRef,
+		children: children || "▼"
+	});
+});
+var [PortalProvider, usePortalContext] = createSelectContext("SelectPortal", { forceMount: void 0 });
+var SelectPortal = (props) => {
+	const { __scopeSelect, forceMount, ...portalProps } = props;
+	return /* @__PURE__ */ jsx(PortalProvider, {
+		scope: props.__scopeSelect,
+		forceMount,
+		children: /* @__PURE__ */ jsx(Portal, {
+			asChild: true,
+			...portalProps
+		})
+	});
+};
+var CONTENT_NAME = "SelectContent";
+var SelectContent = /* @__PURE__ */ React.forwardRef(function SelectContent(props, forwardedRef) {
+	const portalContext = usePortalContext(CONTENT_NAME, props.__scopeSelect);
+	const { forceMount = portalContext.forceMount, ...contentProps } = props;
+	const context = useSelectContext(CONTENT_NAME, props.__scopeSelect);
+	const [fragment, setFragment] = React.useState();
+	useLayoutEffect(() => {
+		setFragment(new DocumentFragment());
+	}, []);
+	return /* @__PURE__ */ jsx(Presence, {
+		present: forceMount || context.open,
+		children: ({ present }) => present ? /* @__PURE__ */ jsx(SelectContentImpl, {
+			...contentProps,
+			ref: forwardedRef
+		}) : /* @__PURE__ */ jsx(SelectContentFragment, {
+			...contentProps,
+			fragment
+		})
+	});
+});
+var SelectContentFragment = /* @__PURE__ */ React.forwardRef(function SelectContentFragment(props, forwardedRef) {
+	const { __scopeSelect, children, fragment } = props;
+	if (!fragment) return null;
+	return ReactDOM.createPortal(/* @__PURE__ */ jsx(SelectContentProvider, {
+		scope: __scopeSelect,
+		children: /* @__PURE__ */ jsx(Collection.Slot, {
+			scope: __scopeSelect,
+			children: /* @__PURE__ */ jsx("div", {
+				ref: forwardedRef,
+				children
+			})
+		})
+	}), fragment);
+});
+var CONTENT_MARGIN = 10;
+var [SelectContentProvider, useSelectContentContext] = createSelectContext(CONTENT_NAME);
+var Slot = /* @__PURE__ */ createSlot("SelectContent.RemoveScroll");
+var SelectContentImpl = /* @__PURE__ */ React.forwardRef(function SelectContentImpl(props, forwardedRef) {
+	const { __scopeSelect } = props;
+	const { position = "item-aligned", onCloseAutoFocus, onEscapeKeyDown, onPointerDownOutside, side, sideOffset, align, alignOffset, arrowPadding, collisionBoundary, collisionPadding, sticky, hideWhenDetached, avoidCollisions, ...contentProps } = props;
+	const context = useSelectContext(CONTENT_NAME, __scopeSelect);
+	const [content, setContent] = React.useState(null);
+	const [viewport, setViewport] = React.useState(null);
+	const composedRefs = useComposedRefs(forwardedRef, setContent);
+	const [selectedItem, setSelectedItem] = React.useState(null);
+	const [selectedItemText, setSelectedItemText] = React.useState(null);
+	const getItems = useCollection(__scopeSelect);
+	const [isPositioned, setIsPositioned] = React.useState(false);
+	const firstValidItemFoundRef = React.useRef(false);
+	React.useEffect(() => {
+		if (content) return hideOthers(content);
+	}, [content]);
+	useFocusGuards();
+	const focusFirst = React.useCallback((candidates) => {
+		const [firstItem, ...restItems] = getItems().map((item) => item.ref.current);
+		const [lastItem] = restItems.slice(-1);
+		const PREVIOUSLY_FOCUSED_ELEMENT = document.activeElement;
+		for (const candidate of candidates) {
+			if (candidate === PREVIOUSLY_FOCUSED_ELEMENT) return;
+			candidate?.scrollIntoView({ block: "nearest" });
+			if (candidate === firstItem && viewport) viewport.scrollTop = 0;
+			if (candidate === lastItem && viewport) viewport.scrollTop = viewport.scrollHeight;
+			candidate?.focus();
+			if (document.activeElement !== PREVIOUSLY_FOCUSED_ELEMENT) return;
+		}
+	}, [getItems, viewport]);
+	const focusSelectedItem = React.useCallback(() => focusFirst([selectedItem, content]), [
+		focusFirst,
+		selectedItem,
+		content
+	]);
+	React.useEffect(() => {
+		if (isPositioned) focusSelectedItem();
+	}, [isPositioned, focusSelectedItem]);
+	const { onOpenChange, triggerPointerDownPosRef } = context;
+	React.useEffect(() => {
+		if (content) {
+			let pointerMoveDelta = {
+				x: 0,
+				y: 0
+			};
+			const handlePointerMove = (event) => {
+				pointerMoveDelta = {
+					x: Math.abs(Math.round(event.pageX) - (triggerPointerDownPosRef.current?.x ?? 0)),
+					y: Math.abs(Math.round(event.pageY) - (triggerPointerDownPosRef.current?.y ?? 0))
+				};
+			};
+			const handlePointerUp = (event) => {
+				if (pointerMoveDelta.x <= 10 && pointerMoveDelta.y <= 10) event.preventDefault();
+				else if (!event.composedPath().includes(content)) onOpenChange(false);
+				document.removeEventListener("pointermove", handlePointerMove);
+				triggerPointerDownPosRef.current = null;
+			};
+			if (triggerPointerDownPosRef.current !== null) {
+				document.addEventListener("pointermove", handlePointerMove);
+				document.addEventListener("pointerup", handlePointerUp, {
+					capture: true,
+					once: true
+				});
+			}
+			return () => {
+				document.removeEventListener("pointermove", handlePointerMove);
+				document.removeEventListener("pointerup", handlePointerUp, { capture: true });
+			};
+		}
+	}, [
+		content,
+		onOpenChange,
+		triggerPointerDownPosRef
+	]);
+	React.useEffect(() => {
+		const close = () => onOpenChange(false);
+		window.addEventListener("blur", close);
+		window.addEventListener("resize", close);
+		return () => {
+			window.removeEventListener("blur", close);
+			window.removeEventListener("resize", close);
+		};
+	}, [onOpenChange]);
+	const [searchRef, handleTypeaheadSearch] = useTypeaheadSearch((search) => {
+		const enabledItems = getItems().filter((item) => !item.disabled);
+		const nextItem = findNextItem(enabledItems, search, enabledItems.find((item) => item.ref.current === document.activeElement));
+		if (nextItem)
+ /**
+		* Imperative focus during keydown is risky so we prevent React's batching updates
+		* to avoid potential bugs. See: https://github.com/facebook/react/issues/20332
+		*/
+		setTimeout(() => nextItem.ref.current?.focus());
+	});
+	const itemRefCallback = React.useCallback((node, value, disabled) => {
+		const isFirstValidItem = !firstValidItemFoundRef.current && !disabled;
+		if (context.value !== void 0 && context.value === value || isFirstValidItem) {
+			setSelectedItem(node);
+			if (isFirstValidItem) firstValidItemFoundRef.current = true;
+		}
+	}, [context.value]);
+	const handleItemLeave = React.useCallback(() => content?.focus(), [content]);
+	const itemTextRefCallback = React.useCallback((node, value, disabled) => {
+		const isFirstValidItem = !firstValidItemFoundRef.current && !disabled;
+		if (context.value !== void 0 && context.value === value || isFirstValidItem) setSelectedItemText(node);
+	}, [context.value]);
+	const SelectPosition = position === "popper" ? SelectPopperPosition : SelectItemAlignedPosition;
+	const popperContentProps = SelectPosition === SelectPopperPosition ? {
+		side,
+		sideOffset,
+		align,
+		alignOffset,
+		arrowPadding,
+		collisionBoundary,
+		collisionPadding,
+		sticky,
+		hideWhenDetached,
+		avoidCollisions
+	} : {};
+	return /* @__PURE__ */ jsx(SelectContentProvider, {
+		scope: __scopeSelect,
+		content,
+		viewport,
+		onViewportChange: setViewport,
+		itemRefCallback,
+		selectedItem,
+		onItemLeave: handleItemLeave,
+		itemTextRefCallback,
+		focusSelectedItem,
+		selectedItemText,
+		position,
+		isPositioned,
+		searchRef,
+		children: /* @__PURE__ */ jsx(RemoveScroll, {
+			as: Slot,
+			allowPinchZoom: true,
+			children: /* @__PURE__ */ jsx(FocusScope, {
+				asChild: true,
+				trapped: context.open,
+				onMountAutoFocus: (event) => {
+					event.preventDefault();
+				},
+				onUnmountAutoFocus: composeEventHandlers(onCloseAutoFocus, (event) => {
+					context.trigger?.focus({ preventScroll: true });
+					event.preventDefault();
+				}),
+				children: /* @__PURE__ */ jsx(DismissableLayer, {
+					asChild: true,
+					disableOutsidePointerEvents: true,
+					onEscapeKeyDown,
+					onPointerDownOutside,
+					onFocusOutside: (event) => event.preventDefault(),
+					onDismiss: () => context.onOpenChange(false),
+					children: /* @__PURE__ */ jsx(SelectPosition, {
+						role: "listbox",
+						id: context.contentId,
+						"data-state": context.open ? "open" : "closed",
+						dir: context.dir,
+						onContextMenu: (event) => event.preventDefault(),
+						...contentProps,
+						...popperContentProps,
+						onPlaced: () => setIsPositioned(true),
+						ref: composedRefs,
+						style: {
+							display: "flex",
+							flexDirection: "column",
+							outline: "none",
+							...contentProps.style
+						},
+						onKeyDown: composeEventHandlers(contentProps.onKeyDown, (event) => {
+							const isModifierKey = event.ctrlKey || event.altKey || event.metaKey;
+							if (event.key === "Tab") event.preventDefault();
+							if (!isModifierKey && event.key.length === 1) handleTypeaheadSearch(event.key);
+							if ([
+								"ArrowUp",
+								"ArrowDown",
+								"Home",
+								"End"
+							].includes(event.key)) {
+								let candidateNodes = getItems().filter((item) => !item.disabled).map((item) => item.ref.current);
+								if (["ArrowUp", "End"].includes(event.key)) candidateNodes = candidateNodes.slice().reverse();
+								if (["ArrowUp", "ArrowDown"].includes(event.key)) {
+									const currentElement = event.target;
+									const currentIndex = candidateNodes.indexOf(currentElement);
+									candidateNodes = candidateNodes.slice(currentIndex + 1);
+								}
+								/**
+								* Imperative focus during keydown is risky so we prevent React's batching updates
+								* to avoid potential bugs. See: https://github.com/facebook/react/issues/20332
+								*/
+								setTimeout(() => focusFirst(candidateNodes));
+								event.preventDefault();
+							}
+						})
+					})
+				})
+			})
+		})
+	});
+});
+var SelectItemAlignedPosition = /* @__PURE__ */ React.forwardRef(function SelectItemAlignedPosition(props, forwardedRef) {
+	const { __scopeSelect, onPlaced, ...popperProps } = props;
+	const context = useSelectContext(CONTENT_NAME, __scopeSelect);
+	const contentContext = useSelectContentContext(CONTENT_NAME, __scopeSelect);
+	const [contentWrapper, setContentWrapper] = React.useState(null);
+	const [content, setContent] = React.useState(null);
+	const composedRefs = useComposedRefs(forwardedRef, setContent);
+	const getItems = useCollection(__scopeSelect);
+	const shouldExpandOnScrollRef = React.useRef(false);
+	const shouldRepositionRef = React.useRef(true);
+	const { viewport, selectedItem, selectedItemText, focusSelectedItem } = contentContext;
+	const position = React.useCallback(() => {
+		if (context.trigger && context.valueNode && contentWrapper && content && viewport && selectedItem && selectedItemText) {
+			const triggerRect = context.trigger.getBoundingClientRect();
+			const contentRect = content.getBoundingClientRect();
+			const valueNodeRect = context.valueNode.getBoundingClientRect();
+			const itemTextRect = selectedItemText.getBoundingClientRect();
+			if (context.dir !== "rtl") {
+				const itemTextOffset = itemTextRect.left - contentRect.left;
+				const left = valueNodeRect.left - itemTextOffset;
+				const leftDelta = triggerRect.left - left;
+				const minContentWidth = triggerRect.width + leftDelta;
+				const contentWidth = Math.max(minContentWidth, contentRect.width);
+				const rightEdge = window.innerWidth - CONTENT_MARGIN;
+				const clampedLeft = clamp(left, [CONTENT_MARGIN, Math.max(CONTENT_MARGIN, rightEdge - contentWidth)]);
+				contentWrapper.style.minWidth = minContentWidth + "px";
+				contentWrapper.style.left = clampedLeft + "px";
+			} else {
+				const itemTextOffset = contentRect.right - itemTextRect.right;
+				const right = window.innerWidth - valueNodeRect.right - itemTextOffset;
+				const rightDelta = window.innerWidth - triggerRect.right - right;
+				const minContentWidth = triggerRect.width + rightDelta;
+				const contentWidth = Math.max(minContentWidth, contentRect.width);
+				const leftEdge = window.innerWidth - CONTENT_MARGIN;
+				const clampedRight = clamp(right, [CONTENT_MARGIN, Math.max(CONTENT_MARGIN, leftEdge - contentWidth)]);
+				contentWrapper.style.minWidth = minContentWidth + "px";
+				contentWrapper.style.right = clampedRight + "px";
+			}
+			const items = getItems();
+			const availableHeight = window.innerHeight - 20;
+			const itemsHeight = viewport.scrollHeight;
+			const contentStyles = window.getComputedStyle(content);
+			const contentBorderTopWidth = parseInt(contentStyles.borderTopWidth, 10);
+			const contentPaddingTop = parseInt(contentStyles.paddingTop, 10);
+			const contentBorderBottomWidth = parseInt(contentStyles.borderBottomWidth, 10);
+			const contentPaddingBottom = parseInt(contentStyles.paddingBottom, 10);
+			const fullContentHeight = contentBorderTopWidth + contentPaddingTop + itemsHeight + contentPaddingBottom + contentBorderBottomWidth;
+			const minContentHeight = Math.min(selectedItem.offsetHeight * 5, fullContentHeight);
+			const viewportStyles = window.getComputedStyle(viewport);
+			const viewportPaddingTop = parseInt(viewportStyles.paddingTop, 10);
+			const viewportPaddingBottom = parseInt(viewportStyles.paddingBottom, 10);
+			const topEdgeToTriggerMiddle = triggerRect.top + triggerRect.height / 2 - CONTENT_MARGIN;
+			const triggerMiddleToBottomEdge = availableHeight - topEdgeToTriggerMiddle;
+			const selectedItemHalfHeight = selectedItem.offsetHeight / 2;
+			const itemOffsetMiddle = selectedItem.offsetTop + selectedItemHalfHeight;
+			const contentTopToItemMiddle = contentBorderTopWidth + contentPaddingTop + itemOffsetMiddle;
+			const itemMiddleToContentBottom = fullContentHeight - contentTopToItemMiddle;
+			if (contentTopToItemMiddle <= topEdgeToTriggerMiddle) {
+				const isLastItem = items.length > 0 && selectedItem === items[items.length - 1].ref.current;
+				contentWrapper.style.bottom = "0px";
+				const viewportOffsetBottom = content.clientHeight - viewport.offsetTop - viewport.offsetHeight;
+				const height = contentTopToItemMiddle + Math.max(triggerMiddleToBottomEdge, selectedItemHalfHeight + (isLastItem ? viewportPaddingBottom : 0) + viewportOffsetBottom + contentBorderBottomWidth);
+				contentWrapper.style.height = height + "px";
+			} else {
+				const isFirstItem = items.length > 0 && selectedItem === items[0].ref.current;
+				contentWrapper.style.top = "0px";
+				const height = Math.max(topEdgeToTriggerMiddle, contentBorderTopWidth + viewport.offsetTop + (isFirstItem ? viewportPaddingTop : 0) + selectedItemHalfHeight) + itemMiddleToContentBottom;
+				contentWrapper.style.height = height + "px";
+				viewport.scrollTop = contentTopToItemMiddle - topEdgeToTriggerMiddle + viewport.offsetTop;
+			}
+			contentWrapper.style.margin = `${CONTENT_MARGIN}px 0`;
+			contentWrapper.style.minHeight = minContentHeight + "px";
+			contentWrapper.style.maxHeight = availableHeight + "px";
+			onPlaced?.();
+			requestAnimationFrame(() => shouldExpandOnScrollRef.current = true);
+		}
+	}, [
+		getItems,
+		context.trigger,
+		context.valueNode,
+		contentWrapper,
+		content,
+		viewport,
+		selectedItem,
+		selectedItemText,
+		context.dir,
+		onPlaced
+	]);
+	useLayoutEffect(() => position(), [position]);
+	const [contentZIndex, setContentZIndex] = React.useState();
+	useLayoutEffect(() => {
+		if (content) setContentZIndex(window.getComputedStyle(content).zIndex);
+	}, [content]);
+	const handleScrollButtonChange = React.useCallback((node) => {
+		if (node && shouldRepositionRef.current === true) {
+			position();
+			focusSelectedItem?.();
+			shouldRepositionRef.current = false;
+		}
+	}, [position, focusSelectedItem]);
+	return /* @__PURE__ */ jsx(SelectViewportProvider, {
+		scope: __scopeSelect,
+		contentWrapper,
+		shouldExpandOnScrollRef,
+		onScrollButtonChange: handleScrollButtonChange,
+		children: /* @__PURE__ */ jsx("div", {
+			ref: setContentWrapper,
+			style: {
+				display: "flex",
+				flexDirection: "column",
+				position: "fixed",
+				zIndex: contentZIndex
+			},
+			children: /* @__PURE__ */ jsx(Primitive.div, {
+				...popperProps,
+				ref: composedRefs,
+				style: {
+					boxSizing: "border-box",
+					maxHeight: "100%",
+					...popperProps.style
+				}
+			})
+		})
+	});
+});
+var SelectPopperPosition = /* @__PURE__ */ React.forwardRef(function SelectPopperPosition(props, forwardedRef) {
+	const { __scopeSelect, align = "start", collisionPadding = CONTENT_MARGIN, ...popperProps } = props;
+	const popperScope = usePopperScope(__scopeSelect);
+	return /* @__PURE__ */ jsx(Content, {
+		...popperScope,
+		...popperProps,
+		ref: forwardedRef,
+		align,
+		collisionPadding,
+		style: {
+			boxSizing: "border-box",
+			...popperProps.style,
+			"--radix-select-content-transform-origin": "var(--radix-popper-transform-origin)",
+			"--radix-select-content-available-width": "var(--radix-popper-available-width)",
+			"--radix-select-content-available-height": "var(--radix-popper-available-height)",
+			"--radix-select-trigger-width": "var(--radix-popper-anchor-width)",
+			"--radix-select-trigger-height": "var(--radix-popper-anchor-height)"
+		}
+	});
+});
+var [SelectViewportProvider, useSelectViewportContext] = createSelectContext(CONTENT_NAME, {});
+var VIEWPORT_NAME = "SelectViewport";
+var SelectViewport = /* @__PURE__ */ React.forwardRef(function SelectViewport(props, forwardedRef) {
+	const { __scopeSelect, nonce, ...viewportProps } = props;
+	const contentContext = useSelectContentContext(VIEWPORT_NAME, __scopeSelect);
+	const viewportContext = useSelectViewportContext(VIEWPORT_NAME, __scopeSelect);
+	const composedRefs = useComposedRefs(forwardedRef, contentContext.onViewportChange);
+	const prevScrollTopRef = React.useRef(0);
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("style", {
+		dangerouslySetInnerHTML: { __html: `[data-radix-select-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-select-viewport]::-webkit-scrollbar{display:none}` },
+		nonce
+	}), /* @__PURE__ */ jsx(Collection.Slot, {
+		scope: __scopeSelect,
+		children: /* @__PURE__ */ jsx(Primitive.div, {
+			"data-radix-select-viewport": "",
+			role: "presentation",
+			...viewportProps,
+			ref: composedRefs,
+			style: {
+				position: "relative",
+				flex: 1,
+				overflow: "hidden auto",
+				...viewportProps.style
+			},
+			onScroll: composeEventHandlers(viewportProps.onScroll, (event) => {
+				const viewport = event.currentTarget;
+				const { contentWrapper, shouldExpandOnScrollRef } = viewportContext;
+				if (shouldExpandOnScrollRef?.current && contentWrapper) {
+					const scrolledBy = Math.abs(prevScrollTopRef.current - viewport.scrollTop);
+					if (scrolledBy > 0) {
+						const availableHeight = window.innerHeight - 20;
+						const cssMinHeight = parseFloat(contentWrapper.style.minHeight);
+						const cssHeight = parseFloat(contentWrapper.style.height);
+						const prevHeight = Math.max(cssMinHeight, cssHeight);
+						if (prevHeight < availableHeight) {
+							const nextHeight = prevHeight + scrolledBy;
+							const clampedNextHeight = Math.min(availableHeight, nextHeight);
+							const heightDiff = nextHeight - clampedNextHeight;
+							contentWrapper.style.height = clampedNextHeight + "px";
+							if (contentWrapper.style.bottom === "0px") {
+								viewport.scrollTop = heightDiff > 0 ? heightDiff : 0;
+								contentWrapper.style.justifyContent = "flex-end";
+							}
+						}
+					}
+				}
+				prevScrollTopRef.current = viewport.scrollTop;
+			})
+		})
+	})] });
+});
+var [SelectGroupContextProvider, useSelectGroupContext] = createSelectContext("SelectGroup");
+var SelectGroup = /* @__PURE__ */ React.forwardRef(function SelectGroup(props, forwardedRef) {
+	const { __scopeSelect, ...groupProps } = props;
+	const groupId = useId();
+	return /* @__PURE__ */ jsx(SelectGroupContextProvider, {
+		scope: __scopeSelect,
+		id: groupId,
+		children: /* @__PURE__ */ jsx(Primitive.div, {
+			role: "group",
+			"aria-labelledby": groupId,
+			...groupProps,
+			ref: forwardedRef
+		})
+	});
+});
+var LABEL_NAME = "SelectLabel";
+var SelectLabel = /* @__PURE__ */ React.forwardRef(function SelectLabel(props, forwardedRef) {
+	const { __scopeSelect, ...labelProps } = props;
+	const groupContext = useSelectGroupContext(LABEL_NAME, __scopeSelect);
+	return /* @__PURE__ */ jsx(Primitive.div, {
+		id: groupContext.id,
+		...labelProps,
+		ref: forwardedRef
+	});
+});
+var ITEM_NAME = "SelectItem";
+var [SelectItemContextProvider, useSelectItemContext] = createSelectContext(ITEM_NAME);
+var SelectItem = /* @__PURE__ */ React.forwardRef(function SelectItem(props, forwardedRef) {
+	const { __scopeSelect, value, disabled = false, textValue: textValueProp, ...itemProps } = props;
+	const context = useSelectContext(ITEM_NAME, __scopeSelect);
+	const contentContext = useSelectContentContext(ITEM_NAME, __scopeSelect);
+	const isSelected = context.value === value;
+	const [textValue, setTextValue] = React.useState(textValueProp ?? "");
+	const [isFocused, setIsFocused] = React.useState(false);
+	const handleItemRefCallback = useCallbackRef((node) => contentContext.itemRefCallback?.(node, value, disabled));
+	const composedRefs = useComposedRefs(forwardedRef, handleItemRefCallback);
+	const textId = useId();
+	const pointerTypeRef = React.useRef("touch");
+	const handleSelect = () => {
+		if (!disabled) {
+			context.onValueChange(value);
+			context.onOpenChange(false);
+		}
+	};
+	return /* @__PURE__ */ jsx(SelectItemContextProvider, {
+		scope: __scopeSelect,
+		value,
+		disabled,
+		textId,
+		isSelected,
+		onItemTextChange: React.useCallback((node) => {
+			setTextValue((prevTextValue) => prevTextValue || (node?.textContent ?? "").trim());
+		}, []),
+		children: /* @__PURE__ */ jsx(Collection.ItemSlot, {
+			scope: __scopeSelect,
+			value,
+			disabled,
+			textValue,
+			children: /* @__PURE__ */ jsx(Primitive.div, {
+				role: "option",
+				"aria-labelledby": textId,
+				"data-highlighted": isFocused ? "" : void 0,
+				"aria-selected": isSelected && isFocused,
+				"data-state": isSelected ? "checked" : "unchecked",
+				"aria-disabled": disabled || void 0,
+				"data-disabled": disabled ? "" : void 0,
+				tabIndex: disabled ? void 0 : -1,
+				...itemProps,
+				ref: composedRefs,
+				onFocus: composeEventHandlers(itemProps.onFocus, () => setIsFocused(true)),
+				onBlur: composeEventHandlers(itemProps.onBlur, () => setIsFocused(false)),
+				onClick: composeEventHandlers(itemProps.onClick, () => {
+					if (pointerTypeRef.current !== "mouse") handleSelect();
+				}),
+				onPointerUp: composeEventHandlers(itemProps.onPointerUp, () => {
+					if (pointerTypeRef.current === "mouse") handleSelect();
+				}),
+				onPointerDown: composeEventHandlers(itemProps.onPointerDown, (event) => {
+					pointerTypeRef.current = event.pointerType;
+				}),
+				onPointerMove: composeEventHandlers(itemProps.onPointerMove, (event) => {
+					pointerTypeRef.current = event.pointerType;
+					if (disabled) contentContext.onItemLeave?.();
+					else if (pointerTypeRef.current === "mouse") event.currentTarget.focus({ preventScroll: true });
+				}),
+				onPointerLeave: composeEventHandlers(itemProps.onPointerLeave, (event) => {
+					if (event.currentTarget === document.activeElement) contentContext.onItemLeave?.();
+				}),
+				onKeyDown: composeEventHandlers(itemProps.onKeyDown, (event) => {
+					if (disabled || event.target !== event.currentTarget) return;
+					if (contentContext.searchRef?.current !== "" && event.key === " ") return;
+					if (SELECTION_KEYS.includes(event.key)) handleSelect();
+					if (event.key === " ") event.preventDefault();
+				})
+			})
+		})
+	});
+});
+var ITEM_TEXT_NAME = "SelectItemText";
+var SelectItemText = /* @__PURE__ */ React.forwardRef(function SelectItemText(props, forwardedRef) {
+	const { __scopeSelect, className, style, ...itemTextProps } = props;
+	const context = useSelectContext(ITEM_TEXT_NAME, __scopeSelect);
+	const contentContext = useSelectContentContext(ITEM_TEXT_NAME, __scopeSelect);
+	const itemContext = useSelectItemContext(ITEM_TEXT_NAME, __scopeSelect);
+	const nativeOptionsContext = useSelectNativeOptionsContext(ITEM_TEXT_NAME, __scopeSelect);
+	const [itemTextNode, setItemTextNode] = React.useState(null);
+	const handleItemTextRefCallback = useCallbackRef((node) => contentContext.itemTextRefCallback?.(node, itemContext.value, itemContext.disabled));
+	const composedRefs = useComposedRefs(forwardedRef, setItemTextNode, itemContext.onItemTextChange, handleItemTextRefCallback);
+	const textContent = itemTextNode?.textContent;
+	const nativeOption = React.useMemo(() => /* @__PURE__ */ jsx("option", {
+		value: itemContext.value,
+		disabled: itemContext.disabled,
+		children: textContent
+	}, itemContext.value), [
+		itemContext.disabled,
+		itemContext.value,
+		textContent
+	]);
+	const { onNativeOptionAdd, onNativeOptionRemove } = nativeOptionsContext;
+	useLayoutEffect(() => {
+		onNativeOptionAdd(nativeOption);
+		return () => onNativeOptionRemove(nativeOption);
+	}, [
+		onNativeOptionAdd,
+		onNativeOptionRemove,
+		nativeOption
+	]);
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Primitive.span, {
+		id: itemContext.textId,
+		...itemTextProps,
+		ref: composedRefs
+	}), itemContext.isSelected && context.valueNode && !context.valueNodeHasChildren && !shouldShowPlaceholder(context.value) ? ReactDOM.createPortal(itemTextProps.children, context.valueNode) : null] });
+});
+var ITEM_INDICATOR_NAME = "SelectItemIndicator";
+var SelectItemIndicator = /* @__PURE__ */ React.forwardRef(function SelectItemIndicator(props, forwardedRef) {
+	const { __scopeSelect, ...itemIndicatorProps } = props;
+	return useSelectItemContext(ITEM_INDICATOR_NAME, __scopeSelect).isSelected ? /* @__PURE__ */ jsx(Primitive.span, {
+		"aria-hidden": true,
+		...itemIndicatorProps,
+		ref: forwardedRef
+	}) : null;
+});
+var SCROLL_UP_BUTTON_NAME = "SelectScrollUpButton";
+var SelectScrollUpButton = /* @__PURE__ */ React.forwardRef(function SelectScrollUpButton(props, forwardedRef) {
+	const contentContext = useSelectContentContext(SCROLL_UP_BUTTON_NAME, props.__scopeSelect);
+	const viewportContext = useSelectViewportContext(SCROLL_UP_BUTTON_NAME, props.__scopeSelect);
+	const [canScrollUp, setCanScrollUp] = React.useState(false);
+	const composedRefs = useComposedRefs(forwardedRef, viewportContext.onScrollButtonChange);
+	useLayoutEffect(() => {
+		if (contentContext.viewport && contentContext.isPositioned) {
+			const viewport = contentContext.viewport;
+			function handleScroll() {
+				const canScrollUp = viewport.scrollTop > 0;
+				setCanScrollUp(canScrollUp);
+			}
+			handleScroll();
+			viewport.addEventListener("scroll", handleScroll);
+			return () => viewport.removeEventListener("scroll", handleScroll);
+		}
+	}, [contentContext.viewport, contentContext.isPositioned]);
+	return canScrollUp ? /* @__PURE__ */ jsx(SelectScrollButtonImpl, {
+		...props,
+		ref: composedRefs,
+		onAutoScroll: () => {
+			const { viewport, selectedItem } = contentContext;
+			if (viewport && selectedItem) viewport.scrollTop = viewport.scrollTop - selectedItem.offsetHeight;
+		}
+	}) : null;
+});
+var SCROLL_DOWN_BUTTON_NAME = "SelectScrollDownButton";
+var SelectScrollDownButton = /* @__PURE__ */ React.forwardRef(function SelectScrollDownButton(props, forwardedRef) {
+	const contentContext = useSelectContentContext(SCROLL_DOWN_BUTTON_NAME, props.__scopeSelect);
+	const viewportContext = useSelectViewportContext(SCROLL_DOWN_BUTTON_NAME, props.__scopeSelect);
+	const [canScrollDown, setCanScrollDown] = React.useState(false);
+	const composedRefs = useComposedRefs(forwardedRef, viewportContext.onScrollButtonChange);
+	useLayoutEffect(() => {
+		if (contentContext.viewport && contentContext.isPositioned) {
+			const viewport = contentContext.viewport;
+			function handleScroll() {
+				const maxScroll = viewport.scrollHeight - viewport.clientHeight;
+				const canScrollDown = Math.ceil(viewport.scrollTop) < maxScroll;
+				setCanScrollDown(canScrollDown);
+			}
+			handleScroll();
+			viewport.addEventListener("scroll", handleScroll);
+			return () => viewport.removeEventListener("scroll", handleScroll);
+		}
+	}, [contentContext.viewport, contentContext.isPositioned]);
+	return canScrollDown ? /* @__PURE__ */ jsx(SelectScrollButtonImpl, {
+		...props,
+		ref: composedRefs,
+		onAutoScroll: () => {
+			const { viewport, selectedItem } = contentContext;
+			if (viewport && selectedItem) viewport.scrollTop = viewport.scrollTop + selectedItem.offsetHeight;
+		}
+	}) : null;
+});
+var SelectScrollButtonImpl = /* @__PURE__ */ React.forwardRef(function SelectScrollButtonImpl(props, forwardedRef) {
+	const { __scopeSelect, onAutoScroll, ...scrollIndicatorProps } = props;
+	const contentContext = useSelectContentContext("SelectScrollButton", __scopeSelect);
+	const autoScrollTimerRef = React.useRef(null);
+	const getItems = useCollection(__scopeSelect);
+	const clearAutoScrollTimer = React.useCallback(() => {
+		if (autoScrollTimerRef.current !== null) {
+			window.clearInterval(autoScrollTimerRef.current);
+			autoScrollTimerRef.current = null;
+		}
+	}, []);
+	React.useEffect(() => {
+		return () => clearAutoScrollTimer();
+	}, [clearAutoScrollTimer]);
+	useLayoutEffect(() => {
+		getItems().find((item) => item.ref.current === document.activeElement)?.ref.current?.scrollIntoView({ block: "nearest" });
+	}, [getItems]);
+	return /* @__PURE__ */ jsx(Primitive.div, {
+		"aria-hidden": true,
+		...scrollIndicatorProps,
+		ref: forwardedRef,
+		style: {
+			flexShrink: 0,
+			...scrollIndicatorProps.style
+		},
+		onPointerDown: composeEventHandlers(scrollIndicatorProps.onPointerDown, () => {
+			if (autoScrollTimerRef.current === null) autoScrollTimerRef.current = window.setInterval(onAutoScroll, 50);
+		}),
+		onPointerMove: composeEventHandlers(scrollIndicatorProps.onPointerMove, () => {
+			contentContext.onItemLeave?.();
+			if (autoScrollTimerRef.current === null) autoScrollTimerRef.current = window.setInterval(onAutoScroll, 50);
+		}),
+		onPointerLeave: composeEventHandlers(scrollIndicatorProps.onPointerLeave, () => {
+			clearAutoScrollTimer();
+		})
+	});
+});
+var SelectSeparator = /* @__PURE__ */ React.forwardRef(function SelectSeparator(props, forwardedRef) {
+	const { __scopeSelect, ...separatorProps } = props;
+	return /* @__PURE__ */ jsx(Primitive.div, {
+		"aria-hidden": true,
+		...separatorProps,
+		ref: forwardedRef
+	});
+});
+var BUBBLE_INPUT_NAME = "SelectBubbleInput";
+var SelectBubbleInput = /* @__PURE__ */ React.forwardRef(function SelectBubbleInput({ __scopeSelect, ...props }, forwardedRef) {
+	const context = useSelectContext(BUBBLE_INPUT_NAME, __scopeSelect);
+	const { value, onValueChange, required, disabled, name, autoComplete, form } = context;
+	const { nativeOptions, nativeSelectKey } = context;
+	const ref = React.useRef(null);
+	const composedRefs = useComposedRefs(forwardedRef, ref);
+	const selectValue = value ?? "";
+	const prevValue = usePrevious(selectValue);
+	const hasEmptyValueOption = Array.from(nativeOptions).some((option) => (option.props.value ?? "") === "");
+	React.useEffect(() => {
+		const select = ref.current;
+		if (!select) return;
+		const selectProto = window.HTMLSelectElement.prototype;
+		const setValue = Object.getOwnPropertyDescriptor(selectProto, "value").set;
+		if (prevValue !== selectValue && setValue) {
+			const event = new Event("change", { bubbles: true });
+			setValue.call(select, selectValue);
+			select.dispatchEvent(event);
+		}
+	}, [prevValue, selectValue]);
+	/**
+	* We purposefully use a `select` here to support form autofill as much as
+	* possible.
+	*
+	* We purposefully do not add the `value` attribute here to allow the value
+	* to be set programmatically and bubble to any parent form `onChange`
+	* event. Adding the `value` will cause React to consider the programmatic
+	* dispatch a duplicate and it will get swallowed.
+	*
+	* We use visually hidden styles rather than `display: "none"` because
+	* Safari autofill won't work otherwise.
+	*
+	* The native `select` only associates the correct default value if the
+	* corresponding `option` is rendered as a child **at the same time** as
+	* itself. Because it might take a few renders for our items to gather the
+	* information to build the native `option`(s), we key the `select` to make
+	* sure React re-builds it each time the options change.
+	*/
+	return /* @__PURE__ */ jsxs(Primitive.select, {
+		"aria-hidden": true,
+		required,
+		tabIndex: -1,
+		name,
+		autoComplete,
+		disabled,
+		form,
+		onChange: (event) => onValueChange(event.target.value),
+		...props,
+		style: {
+			...VISUALLY_HIDDEN_STYLES,
+			...props.style
+		},
+		ref: composedRefs,
+		defaultValue: selectValue,
+		children: [shouldShowPlaceholder(value) && !hasEmptyValueOption ? /* @__PURE__ */ jsx("option", { value: "" }) : null, Array.from(nativeOptions)]
+	}, nativeSelectKey);
+});
+function isFunction(value) {
+	return typeof value === "function";
+}
+function shouldShowPlaceholder(value) {
+	return value === "" || value === void 0;
+}
+function useTypeaheadSearch(onSearchChange) {
+	const handleSearchChange = useCallbackRef(onSearchChange);
+	const searchRef = React.useRef("");
+	const timerRef = React.useRef(0);
+	const handleTypeaheadSearch = React.useCallback((key) => {
+		const search = searchRef.current + key;
+		handleSearchChange(search);
+		(function updateSearch(value) {
+			searchRef.current = value;
+			window.clearTimeout(timerRef.current);
+			if (value !== "") timerRef.current = window.setTimeout(() => updateSearch(""), 1e3);
+		})(search);
+	}, [handleSearchChange]);
+	const resetTypeahead = React.useCallback(() => {
+		searchRef.current = "";
+		window.clearTimeout(timerRef.current);
+	}, []);
+	React.useEffect(() => {
+		return () => window.clearTimeout(timerRef.current);
+	}, []);
+	return [
+		searchRef,
+		handleTypeaheadSearch,
+		resetTypeahead
+	];
+}
+/**
+* This is the "meat" of the typeahead matching logic. It takes in a list of items,
+* the search and the current item, and returns the next item (or `undefined`).
+*
+* We normalize the search because if a user has repeatedly pressed a character,
+* we want the exact same behavior as if we only had that one character
+* (ie. cycle through items starting with that character)
+*
+* We also reorder the items by wrapping the array around the current item.
+* This is so we always look forward from the current item, and picking the first
+* item will always be the correct one.
+*
+* Finally, if the normalized search is exactly one character, we exclude the
+* current item from the values because otherwise it would be the first to match always
+* and focus would never move. This is as opposed to the regular case, where we
+* don't want focus to move if the current item still matches.
+*/
+function findNextItem(items, search, currentItem) {
+	const normalizedSearch = search.length > 1 && Array.from(search).every((char) => char === search[0]) ? search[0] : search;
+	const currentItemIndex = currentItem ? items.indexOf(currentItem) : -1;
+	let wrappedItems = wrapArray(items, Math.max(currentItemIndex, 0));
+	if (normalizedSearch.length === 1) wrappedItems = wrappedItems.filter((v) => v !== currentItem);
+	const nextItem = wrappedItems.find((item) => item.textValue.toLowerCase().startsWith(normalizedSearch.toLowerCase()));
+	return nextItem !== currentItem ? nextItem : void 0;
+}
+/**
+* Wraps an array around itself at a given start index
+* Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']`
+*/
+function wrapArray(array, startIndex) {
+	return array.map((_, index) => array[(startIndex + index) % array.length]);
+}
+//#endregion
+export { SelectBubbleInput as BubbleInput, SelectBubbleInput, SelectContent as Content, SelectContent, SelectGroup as Group, SelectGroup, SelectIcon as Icon, SelectIcon, SelectItem as Item, SelectItem, SelectItemIndicator as ItemIndicator, SelectItemIndicator, SelectItemText as ItemText, SelectItemText, SelectLabel as Label, SelectLabel, SelectPortal as Portal, SelectPortal, SelectProvider as Provider, SelectProvider, Select as Root, Select, SelectScrollDownButton as ScrollDownButton, SelectScrollDownButton, SelectScrollUpButton as ScrollUpButton, SelectScrollUpButton, SelectSeparator, SelectSeparator as Separator, SelectTrigger, SelectTrigger as Trigger, SelectValue, SelectValue as Value, SelectViewport, SelectViewport as Viewport };
+
+//# sourceMappingURL=select.js.map