@tamagui/select 2.7.6 → 3.0.0-beta.637.1

package/dist/cjs/SelectImpl.native.cjs

@@ -0,0 +1,30 @@
+"use strict";
+
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
+};
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var SelectImpl_native_exports = {};
+__export(SelectImpl_native_exports, { SelectInlineImpl: () => SelectInlineImpl });
+module.exports = __toCommonJS(SelectImpl_native_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var SelectInlineImpl = function(props) {
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: props.children });
+};

package/dist/cjs/SelectImpl.native.js

@@ -1,39 +1,32 @@
 "use strict";
 
+
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
-  for (var name in all) __defProp(target, name, {
-    get: all[name],
-    enumerable: true
-  });
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
 };
 var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-      get: () => from[key],
-      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-    });
-  }
-  return to;
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
 };
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: true
-}), mod);
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var SelectImpl_native_exports = {};
-__export(SelectImpl_native_exports, {
-  SelectInlineImpl: () => SelectInlineImpl
-});
+__export(SelectImpl_native_exports, { SelectInlineImpl: () => SelectInlineImpl });
 module.exports = __toCommonJS(SelectImpl_native_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
-var SelectInlineImpl = function (props) {
-  if (process.env.NODE_ENV === "development") {
-    console.warn("Sheet not implemented inline on native");
-  }
-  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
-    children: props.children
-  });
+var SelectInlineImpl = function(props) {
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: props.children });
 };
+
 //# sourceMappingURL=SelectImpl.native.js.map

package/dist/cjs/SelectImpl.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["SelectImpl_native_exports","__export","SelectInlineImpl","module","exports","__toCommonJS","import_jsx_runtime","require","props","process","env","NODE_ENV","console","warn","jsx","Fragment","children"],"sources":["../../src/SelectImpl.native.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,yBAAA;AAAAC,QAAA,CAAAD,yBAAA;EAAAE,gBAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAC,YAAA,CAAAL,yBAAA;AAAA,IAAAM,kBAAA,GAAmDC,OAAA;AAIxC,IAAIL,gBAAA,GAAmB,SAAAA,CAASM,KAAA,EAAO;EAC9C,IAAIC,OAAA,CAAQC,GAAA,CAAIC,QAAA,KAAa,eAAe;IACxCC,OAAA,CAAQC,IAAA,CAAK,wCAAwC;EACzD;EACA,OAAqB,mBAAAP,kBAAA,CAAAQ,GAAA,EAAKR,kBAAA,CAAAS,QAAA,EAAW;IACjCC,QAAA,EAAUR,KAAA,CAAMQ;EACpB,CAAC;AACL","ignoreList":[]}
+{"version":3,"file":"SelectImpl.native.js","names":[],"sources":["cjs/SelectImpl.native.js"],"sourcesContent":["\"use strict\";\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __export = (target, all) => {\n  for (var name in all)\n    __defProp(target, name, { get: all[name], enumerable: true });\n};\nvar __copyProps = (to, from, except, desc) => {\n  if (from && typeof from === \"object\" || typeof from === \"function\") {\n    for (let key of __getOwnPropNames(from))\n      if (!__hasOwnProp.call(to, key) && key !== except)\n        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n  }\n  return to;\n};\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar SelectImpl_native_exports = {};\n__export(SelectImpl_native_exports, {\n  SelectInlineImpl: () => SelectInlineImpl\n});\nmodule.exports = __toCommonJS(SelectImpl_native_exports);\nvar import_jsx_runtime = require(\"react/jsx-runtime\");\nvar SelectInlineImpl = function(props) {\n  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {\n    children: props.children\n  });\n};\n//# sourceMappingURL=SelectImpl.native.js.map\n"],"mappings":";;;;AACA,IAAI,YAAY,OAAO;AACvB,IAAI,mBAAmB,OAAO;AAC9B,IAAI,oBAAoB,OAAO;AAC/B,IAAI,eAAe,OAAO,UAAU;AACpC,IAAI,YAAY,QAAQ,QAAQ;CAC9B,KAAK,IAAI,QAAQ,KACf,UAAU,QAAQ,MAAM;EAAE,KAAK,IAAI;EAAO,YAAY;CAAK,CAAC;AAChE;AACA,IAAI,eAAe,IAAI,MAAM,QAAQ,SAAS;CAC5C,IAAI,QAAQ,OAAO,SAAS,YAAY,OAAO,SAAS,YAAY;EAClE,KAAK,IAAI,OAAO,kBAAkB,IAAI,GACpC,IAAI,CAAC,aAAa,KAAK,IAAI,GAAG,KAAK,QAAQ,QACzC,UAAU,IAAI,KAAK;GAAE,WAAW,KAAK;GAAM,YAAY,EAAE,OAAO,iBAAiB,MAAM,GAAG,MAAM,KAAK;EAAW,CAAC;CACvH;CACA,OAAO;AACT;AACA,IAAI,gBAAgB,QAAQ,YAAY,UAAU,CAAC,GAAG,cAAc,EAAE,OAAO,KAAK,CAAC,GAAG,GAAG;AACzF,IAAI,4BAA4B,CAAC;AACjC,SAAS,2BAA2B,EAClC,wBAAwB,iBAC1B,CAAC;AACD,OAAO,UAAU,aAAa,yBAAyB;AACvD,IAAI,qBAAqB,QAAQ,mBAAmB;AACpD,IAAI,mBAAmB,SAAS,OAAO;CACrC,OAAuB,iBAAC,GAAG,mBAAmB,KAAK,mBAAmB,UAAU,EAC9E,UAAU,MAAM,SAClB,CAAC;AACH"}

package/dist/cjs/SelectItem.cjs

@@ -1,3 +1,4 @@
+
 var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -5,223 +6,285 @@ var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
-  for (var name in all) __defProp(target, name, {
-    get: all[name],
-    enumerable: true
-  });
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
 };
 var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-      get: () => from[key],
-      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-    });
-  }
-  return to;
+	if (from && typeof from === "object" || typeof from === "function") {
+		for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: () => from[key],
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-// If the importer is in node compatibility mode or this is not an ESM
-// file that has been converted to a CommonJS file using a Babel-
-// compatible transform (i.e. "__esModule" has not been set), then set
-// "default" to the CommonJS "module.exports" for node compatibility.
-isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
-  value: mod,
-  enumerable: true
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
 }) : target, mod));
-var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
-  value: true
-}), mod);
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var SelectItem_exports = {};
 __export(SelectItem_exports, {
-  SelectItem: () => SelectItem,
-  SelectItemContextProvider: () => SelectItemContextProvider,
-  useSelectItemContext: () => useSelectItemContext
+	SelectItem: () => SelectItem,
+	SelectItemContextProvider: () => SelectItemContextProvider,
+	SelectItemFrame: () => SelectItemFrame,
+	useSelectItemContext: () => useSelectItemContext
 });
 module.exports = __toCommonJS(SelectItem_exports);
 var import_compose_refs = require("@tamagui/compose-refs");
+var import_adapt = require("@tamagui/adapt");
 var import_constants = require("@tamagui/constants");
 var import_core = require("@tamagui/core");
-var import_list_item = require("@tamagui/list-item");
+var import_helpers = require("@tamagui/helpers");
 var React = __toESM(require("react"), 1);
 var import_context = require("./context.cjs");
+var import_selectionController = require("./selectionController.cjs");
 var import_jsx_runtime = require("react/jsx-runtime");
 const ITEM_NAME = "SelectItem";
-const {
-  Provider: SelectItemContextProvider,
-  useStyledContext: useSelectItemContext
-} = (0, import_core.createStyledContext)(null, ITEM_NAME);
-const SelectItem = import_list_item.ListItem.Frame.styleable(function SelectItem2(props, forwardedRef) {
-  const {
-    scope,
-    value,
-    disabled = false,
-    textValue: textValueProp,
-    index,
-    ...restProps
-  } = props;
-  const context = (0, import_context.useSelectItemParentContext)(scope);
-  const {
-    setSelectedIndex,
-    listRef,
-    setOpen,
-    onChange,
-    activeIndexSubscribe,
-    activeIndexRef,
-    valueSubscribe,
-    allowMouseUpRef,
-    allowSelectRef,
-    setValueAtIndex,
-    selectTimeoutRef,
-    dataRef,
-    interactions,
-    shouldRenderWebNative,
-    size,
-    onActiveChange,
-    initialValue,
-    setActiveIndexFast
-  } = context;
-  const [isSelected, setSelected] = React.useState(initialValue === value);
-  (0, import_constants.useIsomorphicLayoutEffect)(() => {
-    if (initialValue === value) {
-      setSelectedIndex(index);
-    }
-  }, []);
-  React.useEffect(() => {
-    const handleActiveIndex = i => {
-      if (index === i) {
-        onActiveChange(value, index);
-        if (import_constants.isWeb) {
-          requestAnimationFrame(() => {
-            listRef?.current[index]?.focus();
-          });
-        }
-      }
-    };
-    const currentActiveIndex = activeIndexRef?.current;
-    if (currentActiveIndex !== null && currentActiveIndex !== void 0) {
-      handleActiveIndex(currentActiveIndex);
-    }
-    return activeIndexSubscribe(handleActiveIndex);
-  }, [index]);
-  React.useEffect(() => {
-    return valueSubscribe(val => {
-      setSelected(val === value);
-    });
-  }, [value]);
-  const textId = React.useId();
-  const refCallback = React.useCallback(node => {
-    if (!import_constants.isWeb) return;
-    if (node instanceof HTMLElement) {
-      if (listRef) {
-        listRef.current[index] = node;
-      }
-    }
-  }, [index, listRef]);
-  const composedRefs = (0, import_compose_refs.useComposedRefs)(forwardedRef, refCallback);
-  (0, import_constants.useIsomorphicLayoutEffect)(() => {
-    setValueAtIndex(index, value);
-  }, [index, setValueAtIndex, value]);
-  function handleSelect() {
-    setSelectedIndex(index);
-    onChange(value);
-    setOpen(false);
-  }
-  const selectItemProps = React.useMemo(() => {
-    return interactions ? interactions.getItemProps({
-      onTouchMove() {
-        allowSelectRef.current = true;
-        allowMouseUpRef.current = false;
-      },
-      onTouchEnd() {
-        allowSelectRef.current = false;
-        allowMouseUpRef.current = true;
-      },
-      onKeyDown(event) {
-        if (event.key === "Enter" || event.key === " " && !dataRef?.current.typing) {
-          event.preventDefault();
-          handleSelect();
-        } else if (event.key === "ArrowDown" || event.key === "ArrowUp") {
-          event.preventDefault();
-          event.stopPropagation();
-          const itemCount = listRef?.current.length ?? 0;
-          if (itemCount === 0) return;
-          let nextIndex;
-          if (event.key === "ArrowDown") {
-            nextIndex = index + 1 >= itemCount ? 0 : index + 1;
-          } else {
-            nextIndex = index - 1 < 0 ? itemCount - 1 : index - 1;
-          }
-          setActiveIndexFast?.(nextIndex);
-        } else {
-          allowSelectRef.current = true;
-        }
-      },
-      onClick() {
-        if (allowSelectRef.current) {
-          handleSelect();
-        }
-      },
-      onMouseUp() {
-        if (!allowMouseUpRef.current) {
-          allowMouseUpRef.current = true;
-          allowSelectRef.current = true;
-          return;
-        }
-        if (allowSelectRef.current) {
-          handleSelect();
-        }
-        clearTimeout(selectTimeoutRef.current);
-        selectTimeoutRef.current = setTimeout(() => {
-          allowSelectRef.current = true;
-        });
-      }
-    }) : {
-      onPress: handleSelect
-    };
-  }, [handleSelect, index, listRef, setActiveIndexFast]);
-  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(SelectItemContextProvider, {
-    scope,
-    value,
-    textId: textId || "",
-    isSelected,
-    children: shouldRenderWebNative ? /* @__PURE__ */(0, import_jsx_runtime.jsx)("option", {
-      value,
-      children: props.children
-    }) : /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_list_item.ListItem.Frame, {
-      render: "div",
-      componentName: ITEM_NAME,
-      ref: composedRefs,
-      role: "option",
-      "aria-labelledby": textId,
-      "aria-selected": isSelected,
-      "data-state": isSelected ? "active" : "inactive",
-      "aria-disabled": disabled || void 0,
-      "data-disabled": disabled ? "" : void 0,
-      tabIndex: disabled ? void 0 : -1,
-      ...(!props.unstyled && {
-        cursor: "default",
-        size,
-        outlineOffset: -0.5,
-        zIndex: 100,
-        hoverStyle: {
-          backgroundColor: "$backgroundHover"
-        },
-        pressStyle: {
-          backgroundColor: "$backgroundPress"
-        },
-        focusStyle: {
-          backgroundColor: "$backgroundFocus"
-        },
-        focusVisibleStyle: {
-          outlineColor: "$outlineColor",
-          outlineWidth: 1,
-          outlineStyle: "solid"
-        }
-      }),
-      ...restProps,
-      ...selectItemProps
-    })
-  });
-}, {
-  disableTheme: true
-});
+const { Provider: SelectItemContextProvider, useStyledContext: useSelectItemContext } = (0, import_core.createStyledContext)(null, ITEM_NAME);
+const SelectItemFrame = (0, import_core.styled)(import_core.View, {
+	displayName: ITEM_NAME,
+	alignItems: "center",
+	flexDirection: "row"
+});
+const SelectItem = (0, import_core.createStyledHOC)(SelectItemFrame, function SelectItem2(props, forwardedRef) {
+	const { scope, value, disabled: disabledProp, "aria-disabled": ariaDisabled, textValue: textValueProp, ...restProps } = props;
+	const disabled = disabledProp ?? ariaDisabled === true;
+	const context = (0, import_context.useSelectItemParentContext)(scope);
+	const selectContext = (0, import_context.useSelectContext)(scope);
+	const isAdapted = (0, import_adapt.useAdaptIsActive)(selectContext.adaptScope);
+	const { listRef, registry, mode, selectedValues, selectValue, activeIndexSubscribe, activeIndexRef, allowMouseUpRef, allowSelectRef, selectTimeoutRef, interactions, shouldRenderWebNative, setActiveIndexFast, moveActive, search } = context;
+	const isSelected = selectedValues.includes(value);
+	const pendingMouseUpSelectionRef = React.useRef(false);
+	const itemNodeRef = React.useRef(null);
+	const [, rerenderRegistry] = React.useReducer((version) => version + 1, 0);
+	const registrationRef = React.useRef(null);
+	const initialRegistration = React.useRef({
+		value,
+		disabled,
+		textValue: textValueProp
+	});
+	(0, import_constants.useIsomorphicLayoutEffect)(() => registry.subscribe(() => rerenderRegistry()), [registry]);
+	(0, import_constants.useIsomorphicLayoutEffect)(() => {
+		const registration = registry.registerItem(initialRegistration.current);
+		registrationRef.current = registration;
+		const registeredNode = itemNodeRef.current;
+		registration.setNode(registeredNode);
+		const registeredIndex = registry.getItems().findIndex((item) => item.id === registration.id);
+		if (import_constants.isWeb && listRef && registeredIndex >= 0 && registeredNode instanceof HTMLElement) {
+			listRef.current[registeredIndex] = registeredNode;
+		}
+		return () => {
+			const currentIndex = registry.getItems().findIndex((item) => item.id === registration.id);
+			if (listRef && currentIndex >= 0 && listRef.current[currentIndex] === registeredNode) {
+				listRef.current[currentIndex] = null;
+			}
+			registrationRef.current = null;
+			registration.unregister();
+		};
+	}, [registry]);
+	(0, import_constants.useIsomorphicLayoutEffect)(() => {
+		registrationRef.current?.update({
+			value,
+			disabled,
+			textValue: textValueProp
+		});
+	}, [
+		disabled,
+		textValueProp,
+		value
+	]);
+	(0, import_constants.useIsomorphicLayoutEffect)(() => {
+		registrationRef.current?.setNode(itemNodeRef.current);
+	});
+	const index = registry.getIndex(value);
+	React.useEffect(() => {
+		const handleActiveIndex = (i) => {
+			if (index === i) {
+				if (import_constants.isWeb) {
+					requestAnimationFrame(() => {
+						listRef?.current[index]?.focus();
+					});
+				}
+			}
+		};
+		const currentActiveIndex = activeIndexRef?.current;
+		if (currentActiveIndex !== null && currentActiveIndex !== void 0) {
+			handleActiveIndex(currentActiveIndex);
+		}
+		return activeIndexSubscribe(handleActiveIndex);
+	}, [
+		activeIndexRef,
+		activeIndexSubscribe,
+		index,
+		listRef
+	]);
+	const textId = React.useId();
+	const refCallback = React.useCallback((node) => {
+		itemNodeRef.current = node;
+		registrationRef.current?.setNode(node);
+		if (!import_constants.isWeb) return;
+		if (listRef && index >= 0) {
+			listRef.current[index] = node instanceof HTMLElement ? node : null;
+		}
+	}, [index, listRef]);
+	const composedRefs = (0, import_compose_refs.useComposedRefs)(forwardedRef, refCallback);
+	const handleSelect = React.useCallback((event, reason = "item-press") => {
+		if (disabled) return;
+		const nativeEvent = event?.nativeEvent || event;
+		selectValue(value, (0, import_core.createChangeEventDetails)(reason, nativeEvent, event?.currentTarget));
+	}, [
+		disabled,
+		selectValue,
+		value
+	]);
+	const handleKeyDown = React.useCallback((event) => {
+		if (disabled) return;
+		if (event.key === "Enter" || event.key === " ") {
+			event.preventDefault();
+			handleSelect(event, "keyboard");
+			return;
+		}
+		if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+			event.preventDefault();
+			event.stopPropagation();
+			moveActive(event.key === "ArrowDown" ? 1 : -1, event.nativeEvent || event);
+			return;
+		}
+		if (!interactions && event.key?.length === 1 && !event.metaKey && !event.ctrlKey) {
+			search(event.key, event.nativeEvent || event);
+		}
+		if (allowSelectRef) {
+			allowSelectRef.current = true;
+		}
+	}, [
+		allowSelectRef,
+		disabled,
+		handleSelect,
+		interactions,
+		moveActive,
+		search
+	]);
+	const selectItemProps = React.useMemo(() => {
+		if (interactions) {
+			const { onTouchMove, onTouchEnd, onKeyDown, onClick, onMouseUp, onMouseMove, onPress, ...itemProps } = restProps;
+			const interactionProps = interactions.getItemProps({
+				...itemProps,
+				onTouchMove() {
+					allowSelectRef.current = true;
+					allowMouseUpRef.current = false;
+				},
+				onTouchEnd() {
+					allowSelectRef.current = false;
+					allowMouseUpRef.current = true;
+				},
+				onMouseMove(event) {
+					if (disabled || index < 0) return;
+					setActiveIndexFast?.(index, {
+						reason: "item-hover",
+						event: event.nativeEvent || event,
+						trigger: event.currentTarget,
+						index
+					});
+				},
+				onKeyDown: handleKeyDown,
+				onClick(event) {
+					if (disabled) return;
+					const shouldSelect = pendingMouseUpSelectionRef.current || allowSelectRef.current;
+					pendingMouseUpSelectionRef.current = false;
+					clearTimeout(selectTimeoutRef.current);
+					allowSelectRef.current = true;
+					if (shouldSelect) {
+						handleSelect(event);
+					}
+				},
+				onMouseUp(event) {
+					if (disabled) return;
+					if (!allowMouseUpRef.current) {
+						allowMouseUpRef.current = true;
+						allowSelectRef.current = true;
+						return;
+					}
+					pendingMouseUpSelectionRef.current = allowSelectRef.current;
+					clearTimeout(selectTimeoutRef.current);
+					selectTimeoutRef.current = setTimeout(() => {
+						allowSelectRef.current = true;
+						if (pendingMouseUpSelectionRef.current) {
+							pendingMouseUpSelectionRef.current = false;
+							handleSelect(event);
+						}
+					});
+				}
+			});
+			return {
+				...interactionProps,
+				onTouchMove: (0, import_helpers.composeEventHandlers)(onTouchMove, interactionProps.onTouchMove),
+				onTouchEnd: (0, import_helpers.composeEventHandlers)(onTouchEnd, interactionProps.onTouchEnd),
+				onKeyDown: (0, import_helpers.composeEventHandlers)(onKeyDown, interactionProps.onKeyDown),
+				onClick(event) {
+					onClick?.(event);
+					if (event.defaultPrevented) {
+						pendingMouseUpSelectionRef.current = false;
+						clearTimeout(selectTimeoutRef.current);
+						allowSelectRef.current = true;
+						return;
+					}
+					interactionProps.onClick?.(event);
+				},
+				onMouseUp: (0, import_helpers.composeEventHandlers)(onMouseUp, interactionProps.onMouseUp),
+				onMouseMove: (0, import_helpers.composeEventHandlers)(onMouseMove, interactionProps.onMouseMove),
+				onPress
+			};
+		}
+		return {
+			...restProps,
+			onKeyDown: (0, import_helpers.composeEventHandlers)(restProps.onKeyDown, handleKeyDown),
+			onMouseMove: (0, import_helpers.composeEventHandlers)(restProps.onMouseMove, (event) => {
+				if (disabled || index < 0) return;
+				setActiveIndexFast?.(index, {
+					reason: "item-hover",
+					event: event.nativeEvent || event,
+					trigger: event.currentTarget,
+					index
+				});
+			}),
+			onPress: (0, import_helpers.composeEventHandlers)(restProps.onPress, handleSelect)
+		};
+	}, [
+		allowMouseUpRef,
+		allowSelectRef,
+		disabled,
+		handleKeyDown,
+		handleSelect,
+		index,
+		interactions,
+		restProps,
+		selectTimeoutRef,
+		setActiveIndexFast
+	]);
+	const accessibilityProps = (0, import_selectionController.getSelectOptionProps)(mode, isSelected, disabled, import_constants.isWeb ? "web" : "native");
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectItemContextProvider, {
+		scope,
+		value,
+		textId: textId || "",
+		textValue: textValueProp,
+		isSelected,
+		children: shouldRenderWebNative ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", {
+			value,
+			disabled,
+			children: props.children
+		}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectItemFrame, {
+			render: "div",
+			ref: composedRefs,
+			"aria-labelledby": textId,
+			"data-state": isSelected ? "active" : "inactive",
+			"data-disabled": disabled ? "" : void 0,
+			tabIndex: disabled ? void 0 : import_constants.isWeb && isAdapted ? index === (selectContext.activeIndex ?? selectContext.selectedIndex) ? 0 : -1 : -1,
+			zIndex: 100,
+			...selectItemProps,
+			...accessibilityProps
+		})
+	});
+}, { disableTheme: true });