@tamagui/select 3.0.0-beta.924.1 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (106) hide show
  1. package/dist/cjs/Select.cjs +23 -25
  2. package/dist/cjs/Select.native.cjs +27 -26
  3. package/dist/cjs/Select.native.js +27 -26
  4. package/dist/cjs/Select.native.js.map +1 -1
  5. package/dist/cjs/SelectImpl.cjs +56 -50
  6. package/dist/cjs/SelectItem.cjs +49 -60
  7. package/dist/cjs/SelectItem.native.cjs +51 -79
  8. package/dist/cjs/SelectItem.native.js +51 -79
  9. package/dist/cjs/SelectItem.native.js.map +1 -1
  10. package/dist/cjs/SelectScrollButton.cjs +2 -2
  11. package/dist/cjs/SelectTrigger.cjs +22 -5
  12. package/dist/cjs/SelectTrigger.native.cjs +15 -5
  13. package/dist/cjs/SelectTrigger.native.js +15 -5
  14. package/dist/cjs/SelectTrigger.native.js.map +1 -1
  15. package/dist/cjs/SelectViewport.cjs +22 -30
  16. package/dist/cjs/SelectViewport.native.cjs +2 -2
  17. package/dist/cjs/SelectViewport.native.js +2 -2
  18. package/dist/cjs/SelectViewport.native.js.map +1 -1
  19. package/dist/cjs/selectionController.cjs +15 -5
  20. package/dist/cjs/selectionController.native.cjs +20 -15
  21. package/dist/cjs/selectionController.native.js +20 -15
  22. package/dist/cjs/selectionController.native.js.map +1 -1
  23. package/dist/esm/Select.mjs +27 -28
  24. package/dist/esm/Select.mjs.map +1 -1
  25. package/dist/esm/Select.native.js +31 -29
  26. package/dist/esm/Select.native.js.map +1 -1
  27. package/dist/esm/SelectImpl.mjs +56 -50
  28. package/dist/esm/SelectImpl.mjs.map +1 -1
  29. package/dist/esm/SelectItem.mjs +50 -61
  30. package/dist/esm/SelectItem.mjs.map +1 -1
  31. package/dist/esm/SelectItem.native.js +52 -80
  32. package/dist/esm/SelectItem.native.js.map +1 -1
  33. package/dist/esm/SelectScrollButton.mjs +2 -2
  34. package/dist/esm/SelectScrollButton.mjs.map +1 -1
  35. package/dist/esm/SelectTrigger.mjs +16 -5
  36. package/dist/esm/SelectTrigger.mjs.map +1 -1
  37. package/dist/esm/SelectTrigger.native.js +15 -4
  38. package/dist/esm/SelectTrigger.native.js.map +1 -1
  39. package/dist/esm/SelectViewport.mjs +22 -30
  40. package/dist/esm/SelectViewport.mjs.map +1 -1
  41. package/dist/esm/SelectViewport.native.js +3 -3
  42. package/dist/esm/SelectViewport.native.js.map +1 -1
  43. package/dist/esm/selectionController.mjs +15 -5
  44. package/dist/esm/selectionController.mjs.map +1 -1
  45. package/dist/esm/selectionController.native.js +20 -15
  46. package/dist/esm/selectionController.native.js.map +1 -1
  47. package/dist/jsx/Select.mjs +27 -28
  48. package/dist/jsx/Select.mjs.map +1 -1
  49. package/dist/jsx/Select.native.cjs +27 -26
  50. package/dist/jsx/Select.native.js +27 -26
  51. package/dist/jsx/Select.native.js.map +1 -1
  52. package/dist/jsx/SelectImpl.mjs +56 -50
  53. package/dist/jsx/SelectImpl.mjs.map +1 -1
  54. package/dist/jsx/SelectItem.mjs +50 -61
  55. package/dist/jsx/SelectItem.mjs.map +1 -1
  56. package/dist/jsx/SelectItem.native.cjs +51 -79
  57. package/dist/jsx/SelectItem.native.js +51 -79
  58. package/dist/jsx/SelectItem.native.js.map +1 -1
  59. package/dist/jsx/SelectScrollButton.mjs +2 -2
  60. package/dist/jsx/SelectScrollButton.mjs.map +1 -1
  61. package/dist/jsx/SelectTrigger.mjs +16 -5
  62. package/dist/jsx/SelectTrigger.mjs.map +1 -1
  63. package/dist/jsx/SelectTrigger.native.cjs +15 -5
  64. package/dist/jsx/SelectTrigger.native.js +15 -5
  65. package/dist/jsx/SelectTrigger.native.js.map +1 -1
  66. package/dist/jsx/SelectViewport.mjs +22 -30
  67. package/dist/jsx/SelectViewport.mjs.map +1 -1
  68. package/dist/jsx/SelectViewport.native.cjs +2 -2
  69. package/dist/jsx/SelectViewport.native.js +2 -2
  70. package/dist/jsx/SelectViewport.native.js.map +1 -1
  71. package/dist/jsx/selectionController.mjs +15 -5
  72. package/dist/jsx/selectionController.mjs.map +1 -1
  73. package/dist/jsx/selectionController.native.cjs +20 -15
  74. package/dist/jsx/selectionController.native.js +20 -15
  75. package/dist/jsx/selectionController.native.js.map +1 -1
  76. package/package.json +30 -29
  77. package/src/Select.tsx +41 -41
  78. package/src/SelectImpl.tsx +83 -81
  79. package/src/SelectItem.tsx +66 -91
  80. package/src/SelectScrollButton.tsx +2 -2
  81. package/src/SelectTrigger.tsx +19 -2
  82. package/src/SelectViewport.native.tsx +4 -4
  83. package/src/SelectViewport.tsx +21 -27
  84. package/src/selectionController.ts +20 -5
  85. package/src/types.tsx +26 -21
  86. package/types/Select.d.ts +42 -81
  87. package/types/Select.d.ts.map +1 -1
  88. package/types/SelectImpl.d.ts.map +1 -1
  89. package/types/SelectItem.d.ts +3 -5
  90. package/types/SelectItem.d.ts.map +1 -1
  91. package/types/SelectItemText.d.ts +3 -5
  92. package/types/SelectItemText.d.ts.map +1 -1
  93. package/types/SelectScrollButton.d.ts +5 -9
  94. package/types/SelectScrollButton.d.ts.map +1 -1
  95. package/types/SelectScrollButton.native.d.ts +5 -9
  96. package/types/SelectScrollButton.native.d.ts.map +1 -1
  97. package/types/SelectTrigger.d.ts +3 -5
  98. package/types/SelectTrigger.d.ts.map +1 -1
  99. package/types/SelectViewport.d.ts +4 -9
  100. package/types/SelectViewport.d.ts.map +1 -1
  101. package/types/SelectViewport.native.d.ts +4 -9
  102. package/types/SelectViewport.native.d.ts.map +1 -1
  103. package/types/selectionController.d.ts +2 -0
  104. package/types/selectionController.d.ts.map +1 -1
  105. package/types/types.d.ts +30 -21
  106. package/types/types.d.ts.map +1 -1
@@ -4,7 +4,7 @@ import { isWeb, useIsomorphicLayoutEffect } from "@tamagui/constants";
4
4
  import { View, createChangeEventDetails, createStyledContext, createStyledHOC, styled } from "@tamagui/core";
5
5
  import { composeEventHandlers } from "@tamagui/helpers";
6
6
  import * as React from "react";
7
- import { useSelectContext, useSelectItemParentContext } from "./context.mjs";
7
+ import { useSelectItemParentContext } from "./context.mjs";
8
8
  import { getSelectOptionProps } from "./selectionController.mjs";
9
9
  import { jsx } from "react/jsx-runtime";
10
10
 
@@ -19,34 +19,22 @@ const SelectItem = createStyledHOC(SelectItemFrame, function SelectItem2(props,
19
19
  const { scope, value, disabled: disabledProp, "aria-disabled": ariaDisabled, textValue: textValueProp, ...restProps } = props;
20
20
  const disabled = disabledProp ?? ariaDisabled === true;
21
21
  const context = useSelectItemParentContext(scope);
22
- const selectContext = useSelectContext(scope);
23
- const isAdapted = useAdaptIsActive(selectContext.adaptScope);
24
- const { listRef, registry, mode, selectedValues, selectValue, activeIndexSubscribe, activeIndexRef, allowMouseUpRef, allowSelectRef, selectTimeoutRef, interactions, shouldRenderWebNative, setActiveIndexFast, moveActive, search } = context;
22
+ const isAdapted = useAdaptIsActive(context.adaptScope);
23
+ const { registry, mode, selectedValues, selectValue, activeIndexSubscribe, activeIndexRef, allowMouseUpRef, allowSelectRef, selectTimeoutRef, getItemProps, shouldRenderWebNative, setActiveIndex, lastPointerRef, moveActive, search } = context;
25
24
  const isSelected = selectedValues.includes(value);
26
25
  const pendingMouseUpSelectionRef = React.useRef(false);
27
26
  const itemNodeRef = React.useRef(null);
28
- const [, rerenderRegistry] = React.useReducer((version) => version + 1, 0);
29
27
  const registrationRef = React.useRef(null);
30
28
  const initialRegistration = React.useRef({
31
29
  value,
32
30
  disabled,
33
31
  textValue: textValueProp
34
32
  });
35
- useIsomorphicLayoutEffect(() => registry.subscribe(() => rerenderRegistry()), [registry]);
36
33
  useIsomorphicLayoutEffect(() => {
37
34
  const registration = registry.registerItem(initialRegistration.current);
38
35
  registrationRef.current = registration;
39
- const registeredNode = itemNodeRef.current;
40
- registration.setNode(registeredNode);
41
- const registeredIndex = registry.getItems().findIndex((item) => item.id === registration.id);
42
- if (isWeb && listRef && registeredIndex >= 0 && registeredNode instanceof HTMLElement) {
43
- listRef.current[registeredIndex] = registeredNode;
44
- }
36
+ registration.setNode(itemNodeRef.current);
45
37
  return () => {
46
- const currentIndex = registry.getItems().findIndex((item) => item.id === registration.id);
47
- if (listRef && currentIndex >= 0 && listRef.current[currentIndex] === registeredNode) {
48
- listRef.current[currentIndex] = null;
49
- }
50
38
  registrationRef.current = null;
51
39
  registration.unregister();
52
40
  };
@@ -65,37 +53,34 @@ const SelectItem = createStyledHOC(SelectItemFrame, function SelectItem2(props,
65
53
  useIsomorphicLayoutEffect(() => {
66
54
  registrationRef.current?.setNode(itemNodeRef.current);
67
55
  });
68
- const index = registry.getIndex(value);
56
+ const [isActive, setIsActive] = React.useState(false);
57
+ const isActiveRef = React.useRef(false);
69
58
  React.useEffect(() => {
70
59
  const handleActiveIndex = (i) => {
71
- if (index === i) {
72
- if (isWeb) {
73
- requestAnimationFrame(() => {
74
- listRef?.current[index]?.focus();
75
- });
76
- }
60
+ const next = i != null && registry.getIndex(value) === i;
61
+ if (next !== isActiveRef.current) {
62
+ isActiveRef.current = next;
63
+ setIsActive(next);
64
+ }
65
+ if (next && isWeb) {
66
+ requestAnimationFrame(() => {
67
+ itemNodeRef.current?.focus?.();
68
+ });
77
69
  }
78
70
  };
79
- const currentActiveIndex = activeIndexRef?.current;
80
- if (currentActiveIndex !== null && currentActiveIndex !== void 0) {
81
- handleActiveIndex(currentActiveIndex);
82
- }
71
+ handleActiveIndex(activeIndexRef?.current ?? null);
83
72
  return activeIndexSubscribe(handleActiveIndex);
84
73
  }, [
85
74
  activeIndexRef,
86
75
  activeIndexSubscribe,
87
- index,
88
- listRef
76
+ registry,
77
+ value
89
78
  ]);
90
79
  const textId = React.useId();
91
80
  const refCallback = React.useCallback((node) => {
92
81
  itemNodeRef.current = node;
93
82
  registrationRef.current?.setNode(node);
94
- if (!isWeb) return;
95
- if (listRef && index >= 0) {
96
- listRef.current[index] = node instanceof HTMLElement ? node : null;
97
- }
98
- }, [index, listRef]);
83
+ }, []);
99
84
  const composedRefs = useComposedRefs(forwardedRef, refCallback);
100
85
  const handleSelect = React.useCallback((event, reason = "item-press") => {
101
86
  if (disabled) return;
@@ -106,6 +91,27 @@ const SelectItem = createStyledHOC(SelectItemFrame, function SelectItem2(props,
106
91
  selectValue,
107
92
  value
108
93
  ]);
94
+ const handleMouseMove = React.useCallback((event) => {
95
+ if (disabled) return;
96
+ const index = registry.getIndex(value);
97
+ if (index < 0) return;
98
+ const last = lastPointerRef.current;
99
+ if (event.clientX === last.x && event.clientY === last.y) return;
100
+ last.x = event.clientX;
101
+ last.y = event.clientY;
102
+ setActiveIndex(index, {
103
+ reason: "item-hover",
104
+ event: event.nativeEvent || event,
105
+ trigger: event.currentTarget,
106
+ index
107
+ });
108
+ }, [
109
+ disabled,
110
+ lastPointerRef,
111
+ registry,
112
+ setActiveIndex,
113
+ value
114
+ ]);
109
115
  const handleKeyDown = React.useCallback((event) => {
110
116
  if (disabled) return;
111
117
  if (event.key === "Enter" || event.key === " ") {
@@ -119,7 +125,7 @@ const SelectItem = createStyledHOC(SelectItemFrame, function SelectItem2(props,
119
125
  moveActive(event.key === "ArrowDown" ? 1 : -1, event.nativeEvent || event);
120
126
  return;
121
127
  }
122
- if (!interactions && event.key?.length === 1 && !event.metaKey && !event.ctrlKey) {
128
+ if (!getItemProps && event.key?.length === 1 && !event.metaKey && !event.ctrlKey) {
123
129
  search(event.key, event.nativeEvent || event);
124
130
  }
125
131
  if (allowSelectRef) {
@@ -129,14 +135,14 @@ const SelectItem = createStyledHOC(SelectItemFrame, function SelectItem2(props,
129
135
  allowSelectRef,
130
136
  disabled,
131
137
  handleSelect,
132
- interactions,
138
+ getItemProps,
133
139
  moveActive,
134
140
  search
135
141
  ]);
136
142
  const selectItemProps = React.useMemo(() => {
137
- if (interactions) {
143
+ if (getItemProps) {
138
144
  const { onTouchMove, onTouchEnd, onKeyDown, onClick, onMouseUp, onMouseMove, onPress, ...itemProps } = restProps;
139
- const interactionProps = interactions.getItemProps({
145
+ const interactionProps = getItemProps({
140
146
  ...itemProps,
141
147
  onTouchMove() {
142
148
  allowSelectRef.current = true;
@@ -146,15 +152,7 @@ const SelectItem = createStyledHOC(SelectItemFrame, function SelectItem2(props,
146
152
  allowSelectRef.current = false;
147
153
  allowMouseUpRef.current = true;
148
154
  },
149
- onMouseMove(event) {
150
- if (disabled || index < 0) return;
151
- setActiveIndexFast?.(index, {
152
- reason: "item-hover",
153
- event: event.nativeEvent || event,
154
- trigger: event.currentTarget,
155
- index
156
- });
157
- },
155
+ onMouseMove: handleMouseMove,
158
156
  onKeyDown: handleKeyDown,
159
157
  onClick(event) {
160
158
  if (disabled) return;
@@ -207,15 +205,7 @@ const SelectItem = createStyledHOC(SelectItemFrame, function SelectItem2(props,
207
205
  return {
208
206
  ...restProps,
209
207
  onKeyDown: composeEventHandlers(restProps.onKeyDown, handleKeyDown),
210
- onMouseMove: composeEventHandlers(restProps.onMouseMove, (event) => {
211
- if (disabled || index < 0) return;
212
- setActiveIndexFast?.(index, {
213
- reason: "item-hover",
214
- event: event.nativeEvent || event,
215
- trigger: event.currentTarget,
216
- index
217
- });
218
- }),
208
+ onMouseMove: composeEventHandlers(restProps.onMouseMove, handleMouseMove),
219
209
  onPress: composeEventHandlers(restProps.onPress, handleSelect)
220
210
  };
221
211
  }, [
@@ -223,12 +213,11 @@ const SelectItem = createStyledHOC(SelectItemFrame, function SelectItem2(props,
223
213
  allowSelectRef,
224
214
  disabled,
225
215
  handleKeyDown,
216
+ handleMouseMove,
226
217
  handleSelect,
227
- index,
228
- interactions,
218
+ getItemProps,
229
219
  restProps,
230
- selectTimeoutRef,
231
- setActiveIndexFast
220
+ selectTimeoutRef
232
221
  ]);
233
222
  const accessibilityProps = getSelectOptionProps(mode, isSelected, disabled, isWeb ? "web" : "native");
234
223
  return /* @__PURE__ */ jsx(SelectItemContextProvider, {
@@ -247,7 +236,7 @@ const SelectItem = createStyledHOC(SelectItemFrame, function SelectItem2(props,
247
236
  "aria-labelledby": textId,
248
237
  "data-state": isSelected ? "active" : "inactive",
249
238
  "data-disabled": disabled ? "" : void 0,
250
- tabIndex: disabled ? void 0 : isWeb && isAdapted ? index === (selectContext.activeIndex ?? selectContext.selectedIndex) ? 0 : -1 : -1,
239
+ tabIndex: disabled ? void 0 : isWeb && isAdapted && (isActive || activeIndexRef?.current == null && isSelected) ? 0 : -1,
251
240
  zIndex: 100,
252
241
  ...selectItemProps,
253
242
  ...accessibilityProps
@@ -1 +1 @@
1
- {"version":3,"file":"SelectItem.js","names":[],"sources":["jsx/SelectItem.js"],"sourcesContent":["import { useComposedRefs } from \"@tamagui/compose-refs\";\nimport { useAdaptIsActive } from \"@tamagui/adapt\";\nimport { isWeb, useIsomorphicLayoutEffect } from \"@tamagui/constants\";\nimport {\n createChangeEventDetails,\n createStyledHOC,\n createStyledContext,\n styled,\n View\n} from \"@tamagui/core\";\nimport { composeEventHandlers } from \"@tamagui/helpers\";\nimport * as React from \"react\";\nimport { useSelectContext, useSelectItemParentContext } from \"./context\";\nimport { getSelectOptionProps } from \"./selectionController\";\nimport { jsx } from \"react/jsx-runtime\";\nconst ITEM_NAME = \"SelectItem\";\nconst {\n Provider: SelectItemContextProvider,\n useStyledContext: useSelectItemContext\n} = createStyledContext(null, ITEM_NAME);\nconst SelectItemFrame = styled(View, {\n displayName: ITEM_NAME,\n alignItems: \"center\",\n flexDirection: \"row\"\n});\nconst SelectItem = createStyledHOC(\n SelectItemFrame,\n function SelectItem2(props, forwardedRef) {\n const {\n scope,\n value,\n disabled: disabledProp,\n \"aria-disabled\": ariaDisabled,\n textValue: textValueProp,\n ...restProps\n } = props;\n const disabled = disabledProp ?? ariaDisabled === true;\n const context = useSelectItemParentContext(scope);\n const selectContext = useSelectContext(scope);\n const isAdapted = useAdaptIsActive(selectContext.adaptScope);\n const {\n listRef,\n registry,\n mode,\n selectedValues,\n selectValue,\n activeIndexSubscribe,\n activeIndexRef,\n allowMouseUpRef,\n allowSelectRef,\n selectTimeoutRef,\n interactions,\n shouldRenderWebNative,\n setActiveIndexFast,\n moveActive,\n search\n } = context;\n const isSelected = selectedValues.includes(value);\n const pendingMouseUpSelectionRef = React.useRef(false);\n const itemNodeRef = React.useRef(null);\n const [, rerenderRegistry] = React.useReducer((version) => version + 1, 0);\n const registrationRef = React.useRef(\n null\n );\n const initialRegistration = React.useRef({\n value,\n disabled,\n textValue: textValueProp\n });\n useIsomorphicLayoutEffect(\n () => registry.subscribe(() => rerenderRegistry()),\n [registry]\n );\n useIsomorphicLayoutEffect(() => {\n const registration = registry.registerItem(initialRegistration.current);\n registrationRef.current = registration;\n const registeredNode = itemNodeRef.current;\n registration.setNode(registeredNode);\n const registeredIndex = registry.getItems().findIndex((item) => item.id === registration.id);\n if (isWeb && listRef && registeredIndex >= 0 && registeredNode instanceof HTMLElement) {\n listRef.current[registeredIndex] = registeredNode;\n }\n return () => {\n const currentIndex = registry.getItems().findIndex((item) => item.id === registration.id);\n if (listRef && currentIndex >= 0 && listRef.current[currentIndex] === registeredNode) {\n listRef.current[currentIndex] = null;\n }\n registrationRef.current = null;\n registration.unregister();\n };\n }, [registry]);\n useIsomorphicLayoutEffect(() => {\n registrationRef.current?.update({ value, disabled, textValue: textValueProp });\n }, [disabled, textValueProp, value]);\n useIsomorphicLayoutEffect(() => {\n registrationRef.current?.setNode(itemNodeRef.current);\n });\n const index = registry.getIndex(value);\n React.useEffect(() => {\n const handleActiveIndex = (i) => {\n if (index === i) {\n if (isWeb) {\n requestAnimationFrame(() => {\n listRef?.current[index]?.focus();\n });\n }\n }\n };\n const currentActiveIndex = activeIndexRef?.current;\n if (currentActiveIndex !== null && currentActiveIndex !== void 0) {\n handleActiveIndex(currentActiveIndex);\n }\n return activeIndexSubscribe(handleActiveIndex);\n }, [activeIndexRef, activeIndexSubscribe, index, listRef]);\n const textId = React.useId();\n const refCallback = React.useCallback(\n (node) => {\n itemNodeRef.current = node;\n registrationRef.current?.setNode(node);\n if (!isWeb) return;\n if (listRef && index >= 0) {\n listRef.current[index] = node instanceof HTMLElement ? node : null;\n }\n },\n [index, listRef]\n );\n const composedRefs = useComposedRefs(forwardedRef, refCallback);\n const handleSelect = React.useCallback(\n (event, reason = \"item-press\") => {\n if (disabled) return;\n const nativeEvent = event?.nativeEvent || event;\n selectValue(\n value,\n createChangeEventDetails(\n reason,\n nativeEvent,\n event?.currentTarget\n )\n );\n },\n [disabled, selectValue, value]\n );\n const handleKeyDown = React.useCallback(\n (event) => {\n if (disabled) return;\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n handleSelect(event, \"keyboard\");\n return;\n }\n if (event.key === \"ArrowDown\" || event.key === \"ArrowUp\") {\n event.preventDefault();\n event.stopPropagation();\n moveActive(event.key === \"ArrowDown\" ? 1 : -1, event.nativeEvent || event);\n return;\n }\n if (!interactions && event.key?.length === 1 && !event.metaKey && !event.ctrlKey) {\n search(event.key, event.nativeEvent || event);\n }\n if (allowSelectRef) {\n allowSelectRef.current = true;\n }\n },\n [allowSelectRef, disabled, handleSelect, interactions, moveActive, search]\n );\n const selectItemProps = React.useMemo(() => {\n if (interactions) {\n const {\n onTouchMove,\n onTouchEnd,\n onKeyDown,\n onClick,\n onMouseUp,\n onMouseMove,\n onPress,\n ...itemProps\n } = restProps;\n const interactionProps = interactions.getItemProps({\n ...itemProps,\n onTouchMove() {\n allowSelectRef.current = true;\n allowMouseUpRef.current = false;\n },\n onTouchEnd() {\n allowSelectRef.current = false;\n allowMouseUpRef.current = true;\n },\n onMouseMove(event) {\n if (disabled || index < 0) return;\n setActiveIndexFast?.(index, {\n reason: \"item-hover\",\n event: event.nativeEvent || event,\n trigger: event.currentTarget,\n index\n });\n },\n onKeyDown: handleKeyDown,\n onClick(event) {\n if (disabled) return;\n const shouldSelect = pendingMouseUpSelectionRef.current || allowSelectRef.current;\n pendingMouseUpSelectionRef.current = false;\n clearTimeout(selectTimeoutRef.current);\n allowSelectRef.current = true;\n if (shouldSelect) {\n handleSelect(event);\n }\n },\n onMouseUp(event) {\n if (disabled) return;\n if (!allowMouseUpRef.current) {\n allowMouseUpRef.current = true;\n allowSelectRef.current = true;\n return;\n }\n pendingMouseUpSelectionRef.current = allowSelectRef.current;\n clearTimeout(selectTimeoutRef.current);\n selectTimeoutRef.current = setTimeout(() => {\n allowSelectRef.current = true;\n if (pendingMouseUpSelectionRef.current) {\n pendingMouseUpSelectionRef.current = false;\n handleSelect(event);\n }\n });\n }\n });\n return {\n ...interactionProps,\n onTouchMove: composeEventHandlers(\n onTouchMove,\n interactionProps.onTouchMove\n ),\n onTouchEnd: composeEventHandlers(\n onTouchEnd,\n interactionProps.onTouchEnd\n ),\n onKeyDown: composeEventHandlers(onKeyDown, interactionProps.onKeyDown),\n onClick(event) {\n onClick?.(event);\n if (event.defaultPrevented) {\n pendingMouseUpSelectionRef.current = false;\n clearTimeout(selectTimeoutRef.current);\n allowSelectRef.current = true;\n return;\n }\n interactionProps.onClick?.(event);\n },\n onMouseUp: composeEventHandlers(onMouseUp, interactionProps.onMouseUp),\n onMouseMove: composeEventHandlers(\n onMouseMove,\n interactionProps.onMouseMove\n ),\n onPress\n };\n }\n return {\n ...restProps,\n onKeyDown: composeEventHandlers(restProps.onKeyDown, handleKeyDown),\n onMouseMove: composeEventHandlers(restProps.onMouseMove, (event) => {\n if (disabled || index < 0) return;\n setActiveIndexFast?.(index, {\n reason: \"item-hover\",\n event: event.nativeEvent || event,\n trigger: event.currentTarget,\n index\n });\n }),\n onPress: composeEventHandlers(restProps.onPress, handleSelect)\n };\n }, [\n allowMouseUpRef,\n allowSelectRef,\n disabled,\n handleKeyDown,\n handleSelect,\n index,\n interactions,\n restProps,\n selectTimeoutRef,\n setActiveIndexFast\n ]);\n const accessibilityProps = getSelectOptionProps(\n mode,\n isSelected,\n disabled,\n isWeb ? \"web\" : \"native\"\n );\n return /* @__PURE__ */ jsx(\n SelectItemContextProvider,\n {\n scope,\n value,\n textId: textId || \"\",\n textValue: textValueProp,\n isSelected,\n children: shouldRenderWebNative ? /* @__PURE__ */ jsx(\"option\", { value, disabled, children: props.children }) : /* @__PURE__ */ jsx(\n SelectItemFrame,\n {\n render: \"div\",\n ref: composedRefs,\n \"aria-labelledby\": textId,\n \"data-state\": isSelected ? \"active\" : \"inactive\",\n \"data-disabled\": disabled ? \"\" : void 0,\n tabIndex: disabled ? void 0 : isWeb && isAdapted ? index === (selectContext.activeIndex ?? selectContext.selectedIndex) ? 0 : -1 : -1,\n zIndex: 100,\n ...selectItemProps,\n ...accessibilityProps\n }\n )\n }\n );\n },\n {\n disableTheme: true\n }\n);\nexport {\n SelectItem,\n SelectItemContextProvider,\n SelectItemFrame,\n useSelectItemContext\n};\n//# sourceMappingURL=SelectItem.js.map\n"],"mappings":";;;;;;;;;;;AAeA,MAAM,YAAY;AAClB,MAAM,EACJ,UAAU,2BACV,kBAAkB,yBAChB,oBAAoB,MAAM,SAAS;AACvC,MAAM,kBAAkB,OAAO,MAAM;CACnC,aAAa;CACb,YAAY;CACZ,eAAe;AACjB,CAAC;AACD,MAAM,aAAa,gBACjB,iBACA,SAAS,YAAY,OAAO,cAAc;CACxC,MAAM,EACJ,OACA,OACA,UAAU,cACV,iBAAiB,cACjB,WAAW,eACX,GAAG,cACD;CACJ,MAAM,WAAW,gBAAgB,iBAAiB;CAClD,MAAM,UAAU,2BAA2B,KAAK;CAChD,MAAM,gBAAgB,iBAAiB,KAAK;CAC5C,MAAM,YAAY,iBAAiB,cAAc,UAAU;CAC3D,MAAM,EACJ,SACA,UACA,MACA,gBACA,aACA,sBACA,gBACA,iBACA,gBACA,kBACA,cACA,uBACA,oBACA,YACA,WACE;CACJ,MAAM,aAAa,eAAe,SAAS,KAAK;CAChD,MAAM,6BAA6B,MAAM,OAAO,KAAK;CACrD,MAAM,cAAc,MAAM,OAAO,IAAI;CACrC,MAAM,GAAG,oBAAoB,MAAM,YAAY,YAAY,UAAU,GAAG,CAAC;CACzE,MAAM,kBAAkB,MAAM,OAC5B,IACF;CACA,MAAM,sBAAsB,MAAM,OAAO;EACvC;EACA;EACA,WAAW;CACb,CAAC;CACD,gCACQ,SAAS,gBAAgB,iBAAiB,CAAC,GACjD,CAAC,QAAQ,CACX;CACA,gCAAgC;EAC9B,MAAM,eAAe,SAAS,aAAa,oBAAoB,OAAO;EACtE,gBAAgB,UAAU;EAC1B,MAAM,iBAAiB,YAAY;EACnC,aAAa,QAAQ,cAAc;EACnC,MAAM,kBAAkB,SAAS,SAAS,CAAC,CAAC,WAAW,SAAS,KAAK,OAAO,aAAa,EAAE;EAC3F,IAAI,SAAS,WAAW,mBAAmB,KAAK,0BAA0B,aAAa;GACrF,QAAQ,QAAQ,mBAAmB;EACrC;EACA,aAAa;GACX,MAAM,eAAe,SAAS,SAAS,CAAC,CAAC,WAAW,SAAS,KAAK,OAAO,aAAa,EAAE;GACxF,IAAI,WAAW,gBAAgB,KAAK,QAAQ,QAAQ,kBAAkB,gBAAgB;IACpF,QAAQ,QAAQ,gBAAgB;GAClC;GACA,gBAAgB,UAAU;GAC1B,aAAa,WAAW;EAC1B;CACF,GAAG,CAAC,QAAQ,CAAC;CACb,gCAAgC;EAC9B,gBAAgB,SAAS,OAAO;GAAE;GAAO;GAAU,WAAW;EAAc,CAAC;CAC/E,GAAG;EAAC;EAAU;EAAe;CAAK,CAAC;CACnC,gCAAgC;EAC9B,gBAAgB,SAAS,QAAQ,YAAY,OAAO;CACtD,CAAC;CACD,MAAM,QAAQ,SAAS,SAAS,KAAK;CACrC,MAAM,gBAAgB;EACpB,MAAM,qBAAqB,MAAM;GAC/B,IAAI,UAAU,GAAG;IACf,IAAI,OAAO;KACT,4BAA4B;MAC1B,SAAS,QAAQ,MAAM,EAAE,MAAM;KACjC,CAAC;IACH;GACF;EACF;EACA,MAAM,qBAAqB,gBAAgB;EAC3C,IAAI,uBAAuB,QAAQ,uBAAuB,KAAK,GAAG;GAChE,kBAAkB,kBAAkB;EACtC;EACA,OAAO,qBAAqB,iBAAiB;CAC/C,GAAG;EAAC;EAAgB;EAAsB;EAAO;CAAO,CAAC;CACzD,MAAM,SAAS,MAAM,MAAM;CAC3B,MAAM,cAAc,MAAM,aACvB,SAAS;EACR,YAAY,UAAU;EACtB,gBAAgB,SAAS,QAAQ,IAAI;EACrC,IAAI,CAAC,OAAO;EACZ,IAAI,WAAW,SAAS,GAAG;GACzB,QAAQ,QAAQ,SAAS,gBAAgB,cAAc,OAAO;EAChE;CACF,GACA,CAAC,OAAO,OAAO,CACjB;CACA,MAAM,eAAe,gBAAgB,cAAc,WAAW;CAC9D,MAAM,eAAe,MAAM,aACxB,OAAO,SAAS,iBAAiB;EAChC,IAAI,UAAU;EACd,MAAM,cAAc,OAAO,eAAe;EAC1C,YACE,OACA,yBACE,QACA,aACA,OAAO,aACT,CACF;CACF,GACA;EAAC;EAAU;EAAa;CAAK,CAC/B;CACA,MAAM,gBAAgB,MAAM,aACzB,UAAU;EACT,IAAI,UAAU;EACd,IAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAK;GAC9C,MAAM,eAAe;GACrB,aAAa,OAAO,UAAU;GAC9B;EACF;EACA,IAAI,MAAM,QAAQ,eAAe,MAAM,QAAQ,WAAW;GACxD,MAAM,eAAe;GACrB,MAAM,gBAAgB;GACtB,WAAW,MAAM,QAAQ,cAAc,IAAI,CAAC,GAAG,MAAM,eAAe,KAAK;GACzE;EACF;EACA,IAAI,CAAC,gBAAgB,MAAM,KAAK,WAAW,KAAK,CAAC,MAAM,WAAW,CAAC,MAAM,SAAS;GAChF,OAAO,MAAM,KAAK,MAAM,eAAe,KAAK;EAC9C;EACA,IAAI,gBAAgB;GAClB,eAAe,UAAU;EAC3B;CACF,GACA;EAAC;EAAgB;EAAU;EAAc;EAAc;EAAY;CAAM,CAC3E;CACA,MAAM,kBAAkB,MAAM,cAAc;EAC1C,IAAI,cAAc;GAChB,MAAM,EACJ,aACA,YACA,WACA,SACA,WACA,aACA,SACA,GAAG,cACD;GACJ,MAAM,mBAAmB,aAAa,aAAa;IACjD,GAAG;IACH,cAAc;KACZ,eAAe,UAAU;KACzB,gBAAgB,UAAU;IAC5B;IACA,aAAa;KACX,eAAe,UAAU;KACzB,gBAAgB,UAAU;IAC5B;IACA,YAAY,OAAO;KACjB,IAAI,YAAY,QAAQ,GAAG;KAC3B,qBAAqB,OAAO;MAC1B,QAAQ;MACR,OAAO,MAAM,eAAe;MAC5B,SAAS,MAAM;MACf;KACF,CAAC;IACH;IACA,WAAW;IACX,QAAQ,OAAO;KACb,IAAI,UAAU;KACd,MAAM,eAAe,2BAA2B,WAAW,eAAe;KAC1E,2BAA2B,UAAU;KACrC,aAAa,iBAAiB,OAAO;KACrC,eAAe,UAAU;KACzB,IAAI,cAAc;MAChB,aAAa,KAAK;KACpB;IACF;IACA,UAAU,OAAO;KACf,IAAI,UAAU;KACd,IAAI,CAAC,gBAAgB,SAAS;MAC5B,gBAAgB,UAAU;MAC1B,eAAe,UAAU;MACzB;KACF;KACA,2BAA2B,UAAU,eAAe;KACpD,aAAa,iBAAiB,OAAO;KACrC,iBAAiB,UAAU,iBAAiB;MAC1C,eAAe,UAAU;MACzB,IAAI,2BAA2B,SAAS;OACtC,2BAA2B,UAAU;OACrC,aAAa,KAAK;MACpB;KACF,CAAC;IACH;GACF,CAAC;GACD,OAAO;IACL,GAAG;IACH,aAAa,qBACX,aACA,iBAAiB,WACnB;IACA,YAAY,qBACV,YACA,iBAAiB,UACnB;IACA,WAAW,qBAAqB,WAAW,iBAAiB,SAAS;IACrE,QAAQ,OAAO;KACb,UAAU,KAAK;KACf,IAAI,MAAM,kBAAkB;MAC1B,2BAA2B,UAAU;MACrC,aAAa,iBAAiB,OAAO;MACrC,eAAe,UAAU;MACzB;KACF;KACA,iBAAiB,UAAU,KAAK;IAClC;IACA,WAAW,qBAAqB,WAAW,iBAAiB,SAAS;IACrE,aAAa,qBACX,aACA,iBAAiB,WACnB;IACA;GACF;EACF;EACA,OAAO;GACL,GAAG;GACH,WAAW,qBAAqB,UAAU,WAAW,aAAa;GAClE,aAAa,qBAAqB,UAAU,cAAc,UAAU;IAClE,IAAI,YAAY,QAAQ,GAAG;IAC3B,qBAAqB,OAAO;KAC1B,QAAQ;KACR,OAAO,MAAM,eAAe;KAC5B,SAAS,MAAM;KACf;IACF,CAAC;GACH,CAAC;GACD,SAAS,qBAAqB,UAAU,SAAS,YAAY;EAC/D;CACF,GAAG;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CACD,MAAM,qBAAqB,qBACzB,MACA,YACA,UACA,QAAQ,QAAQ,QAClB;CACA,OAAuB,oBACrB,2BACA;EACE;EACA;EACA,QAAQ,UAAU;EAClB,WAAW;EACX;EACA,UAAU,wBAAwC,oBAAI,UAAU;GAAE;GAAO;GAAU,UAAU,MAAM;EAAS,CAAC,IAAoB,oBAC/H,iBACA;GACE,QAAQ;GACR,KAAK;GACL,mBAAmB;GACnB,cAAc,aAAa,WAAW;GACtC,iBAAiB,WAAW,KAAK,KAAK;GACtC,UAAU,WAAW,KAAK,IAAI,SAAS,YAAY,WAAW,cAAc,eAAe,cAAc,iBAAiB,IAAI,CAAC,IAAI,CAAC;GACpI,QAAQ;GACR,GAAG;GACH,GAAG;EACL,CACF;CACF,CACF;AACF,GACA,EACE,cAAc,KAChB,CACF"}
1
+ {"version":3,"file":"SelectItem.js","names":[],"sources":["jsx/SelectItem.js"],"sourcesContent":["import { useComposedRefs } from \"@tamagui/compose-refs\";\nimport { useAdaptIsActive } from \"@tamagui/adapt\";\nimport { isWeb, useIsomorphicLayoutEffect } from \"@tamagui/constants\";\nimport {\n createChangeEventDetails,\n createStyledHOC,\n createStyledContext,\n styled,\n View\n} from \"@tamagui/core\";\nimport { composeEventHandlers } from \"@tamagui/helpers\";\nimport * as React from \"react\";\nimport { useSelectItemParentContext } from \"./context\";\nimport { getSelectOptionProps } from \"./selectionController\";\nimport { jsx } from \"react/jsx-runtime\";\nconst ITEM_NAME = \"SelectItem\";\nconst {\n Provider: SelectItemContextProvider,\n useStyledContext: useSelectItemContext\n} = createStyledContext(null, ITEM_NAME);\nconst SelectItemFrame = styled(View, {\n displayName: ITEM_NAME,\n alignItems: \"center\",\n flexDirection: \"row\"\n});\nconst SelectItem = createStyledHOC(\n SelectItemFrame,\n function SelectItem2(props, forwardedRef) {\n const {\n scope,\n value,\n disabled: disabledProp,\n \"aria-disabled\": ariaDisabled,\n textValue: textValueProp,\n ...restProps\n } = props;\n const disabled = disabledProp ?? ariaDisabled === true;\n const context = useSelectItemParentContext(scope);\n const isAdapted = useAdaptIsActive(context.adaptScope);\n const {\n registry,\n mode,\n selectedValues,\n selectValue,\n activeIndexSubscribe,\n activeIndexRef,\n allowMouseUpRef,\n allowSelectRef,\n selectTimeoutRef,\n getItemProps,\n shouldRenderWebNative,\n setActiveIndex,\n lastPointerRef,\n moveActive,\n search\n } = context;\n const isSelected = selectedValues.includes(value);\n const pendingMouseUpSelectionRef = React.useRef(false);\n const itemNodeRef = React.useRef(null);\n const registrationRef = React.useRef(\n null\n );\n const initialRegistration = React.useRef({\n value,\n disabled,\n textValue: textValueProp\n });\n useIsomorphicLayoutEffect(() => {\n const registration = registry.registerItem(initialRegistration.current);\n registrationRef.current = registration;\n registration.setNode(itemNodeRef.current);\n return () => {\n registrationRef.current = null;\n registration.unregister();\n };\n }, [registry]);\n useIsomorphicLayoutEffect(() => {\n registrationRef.current?.update({ value, disabled, textValue: textValueProp });\n }, [disabled, textValueProp, value]);\n useIsomorphicLayoutEffect(() => {\n registrationRef.current?.setNode(itemNodeRef.current);\n });\n const [isActive, setIsActive] = React.useState(false);\n const isActiveRef = React.useRef(false);\n React.useEffect(() => {\n const handleActiveIndex = (i) => {\n const next = i != null && registry.getIndex(value) === i;\n if (next !== isActiveRef.current) {\n isActiveRef.current = next;\n setIsActive(next);\n }\n if (next && isWeb) {\n requestAnimationFrame(() => {\n itemNodeRef.current?.focus?.();\n });\n }\n };\n handleActiveIndex(activeIndexRef?.current ?? null);\n return activeIndexSubscribe(handleActiveIndex);\n }, [activeIndexRef, activeIndexSubscribe, registry, value]);\n const textId = React.useId();\n const refCallback = React.useCallback((node) => {\n itemNodeRef.current = node;\n registrationRef.current?.setNode(node);\n }, []);\n const composedRefs = useComposedRefs(forwardedRef, refCallback);\n const handleSelect = React.useCallback(\n (event, reason = \"item-press\") => {\n if (disabled) return;\n const nativeEvent = event?.nativeEvent || event;\n selectValue(\n value,\n createChangeEventDetails(\n reason,\n nativeEvent,\n event?.currentTarget\n )\n );\n },\n [disabled, selectValue, value]\n );\n const handleMouseMove = React.useCallback(\n (event) => {\n if (disabled) return;\n const index = registry.getIndex(value);\n if (index < 0) return;\n const last = lastPointerRef.current;\n if (event.clientX === last.x && event.clientY === last.y) return;\n last.x = event.clientX;\n last.y = event.clientY;\n setActiveIndex(index, {\n reason: \"item-hover\",\n event: event.nativeEvent || event,\n trigger: event.currentTarget,\n index\n });\n },\n [disabled, lastPointerRef, registry, setActiveIndex, value]\n );\n const handleKeyDown = React.useCallback(\n (event) => {\n if (disabled) return;\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n handleSelect(event, \"keyboard\");\n return;\n }\n if (event.key === \"ArrowDown\" || event.key === \"ArrowUp\") {\n event.preventDefault();\n event.stopPropagation();\n moveActive(event.key === \"ArrowDown\" ? 1 : -1, event.nativeEvent || event);\n return;\n }\n if (!getItemProps && event.key?.length === 1 && !event.metaKey && !event.ctrlKey) {\n search(event.key, event.nativeEvent || event);\n }\n if (allowSelectRef) {\n allowSelectRef.current = true;\n }\n },\n [allowSelectRef, disabled, handleSelect, getItemProps, moveActive, search]\n );\n const selectItemProps = React.useMemo(() => {\n if (getItemProps) {\n const {\n onTouchMove,\n onTouchEnd,\n onKeyDown,\n onClick,\n onMouseUp,\n onMouseMove,\n onPress,\n ...itemProps\n } = restProps;\n const interactionProps = getItemProps({\n ...itemProps,\n onTouchMove() {\n allowSelectRef.current = true;\n allowMouseUpRef.current = false;\n },\n onTouchEnd() {\n allowSelectRef.current = false;\n allowMouseUpRef.current = true;\n },\n onMouseMove: handleMouseMove,\n onKeyDown: handleKeyDown,\n onClick(event) {\n if (disabled) return;\n const shouldSelect = pendingMouseUpSelectionRef.current || allowSelectRef.current;\n pendingMouseUpSelectionRef.current = false;\n clearTimeout(selectTimeoutRef.current);\n allowSelectRef.current = true;\n if (shouldSelect) {\n handleSelect(event);\n }\n },\n onMouseUp(event) {\n if (disabled) return;\n if (!allowMouseUpRef.current) {\n allowMouseUpRef.current = true;\n allowSelectRef.current = true;\n return;\n }\n pendingMouseUpSelectionRef.current = allowSelectRef.current;\n clearTimeout(selectTimeoutRef.current);\n selectTimeoutRef.current = setTimeout(() => {\n allowSelectRef.current = true;\n if (pendingMouseUpSelectionRef.current) {\n pendingMouseUpSelectionRef.current = false;\n handleSelect(event);\n }\n });\n }\n });\n return {\n ...interactionProps,\n onTouchMove: composeEventHandlers(\n onTouchMove,\n interactionProps.onTouchMove\n ),\n onTouchEnd: composeEventHandlers(\n onTouchEnd,\n interactionProps.onTouchEnd\n ),\n onKeyDown: composeEventHandlers(onKeyDown, interactionProps.onKeyDown),\n onClick(event) {\n onClick?.(event);\n if (event.defaultPrevented) {\n pendingMouseUpSelectionRef.current = false;\n clearTimeout(selectTimeoutRef.current);\n allowSelectRef.current = true;\n return;\n }\n interactionProps.onClick?.(event);\n },\n onMouseUp: composeEventHandlers(onMouseUp, interactionProps.onMouseUp),\n onMouseMove: composeEventHandlers(\n onMouseMove,\n interactionProps.onMouseMove\n ),\n onPress\n };\n }\n return {\n ...restProps,\n onKeyDown: composeEventHandlers(restProps.onKeyDown, handleKeyDown),\n onMouseMove: composeEventHandlers(restProps.onMouseMove, handleMouseMove),\n onPress: composeEventHandlers(restProps.onPress, handleSelect)\n };\n }, [\n allowMouseUpRef,\n allowSelectRef,\n disabled,\n handleKeyDown,\n handleMouseMove,\n handleSelect,\n getItemProps,\n restProps,\n selectTimeoutRef\n ]);\n const accessibilityProps = getSelectOptionProps(\n mode,\n isSelected,\n disabled,\n isWeb ? \"web\" : \"native\"\n );\n return /* @__PURE__ */ jsx(\n SelectItemContextProvider,\n {\n scope,\n value,\n textId: textId || \"\",\n textValue: textValueProp,\n isSelected,\n children: shouldRenderWebNative ? /* @__PURE__ */ jsx(\"option\", { value, disabled, children: props.children }) : /* @__PURE__ */ jsx(\n SelectItemFrame,\n {\n render: \"div\",\n ref: composedRefs,\n \"aria-labelledby\": textId,\n \"data-state\": isSelected ? \"active\" : \"inactive\",\n \"data-disabled\": disabled ? \"\" : void 0,\n tabIndex: disabled ? void 0 : isWeb && isAdapted && (isActive || activeIndexRef?.current == null && isSelected) ? 0 : -1,\n zIndex: 100,\n ...selectItemProps,\n ...accessibilityProps\n }\n )\n }\n );\n },\n {\n disableTheme: true\n }\n);\nexport {\n SelectItem,\n SelectItemContextProvider,\n SelectItemFrame,\n useSelectItemContext\n};\n//# sourceMappingURL=SelectItem.js.map\n"],"mappings":"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"}
@@ -43,13 +43,6 @@ var import_helpers = require("@tamagui/helpers");
43
43
  var React = __toESM(require("react"), 1);
44
44
  var import_context = require("./context.native.js");
45
45
  var import_selectionController = require("./selectionController.native.js");
46
- function _instanceof(left, right) {
47
- if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
48
- return !!right[Symbol.hasInstance](left);
49
- } else {
50
- return left instanceof right;
51
- }
52
- }
53
46
  var ITEM_NAME = "SelectItem";
54
47
  var { Provider: SelectItemContextProvider, useStyledContext: useSelectItemContext } = (0, import_core.createStyledContext)(null, ITEM_NAME);
55
48
  var SelectItemFrame = (0, import_core.styled)(import_core.View, {
@@ -61,44 +54,22 @@ var SelectItem = (0, import_core.createStyledHOC)(SelectItemFrame, function Sele
61
54
  var { scope, value, disabled: disabledProp, "aria-disabled": ariaDisabled, textValue: textValueProp, ...restProps } = props;
62
55
  var disabled = disabledProp !== null && disabledProp !== void 0 ? disabledProp : ariaDisabled === true;
63
56
  var context = (0, import_context.useSelectItemParentContext)(scope);
64
- var selectContext = (0, import_context.useSelectContext)(scope);
65
- var isAdapted = (0, import_adapt.useAdaptIsActive)(selectContext.adaptScope);
66
- var { listRef, registry, mode, selectedValues, selectValue, activeIndexSubscribe, activeIndexRef, allowMouseUpRef, allowSelectRef, selectTimeoutRef, interactions, shouldRenderWebNative, setActiveIndexFast, moveActive, search } = context;
57
+ var isAdapted = (0, import_adapt.useAdaptIsActive)(context.adaptScope);
58
+ var { registry, mode, selectedValues, selectValue, activeIndexSubscribe, activeIndexRef, allowMouseUpRef, allowSelectRef, selectTimeoutRef, getItemProps, shouldRenderWebNative, setActiveIndex, lastPointerRef, moveActive, search } = context;
67
59
  var isSelected = selectedValues.includes(value);
68
60
  var pendingMouseUpSelectionRef = React.useRef(false);
69
61
  var itemNodeRef = React.useRef(null);
70
- var [, rerenderRegistry] = React.useReducer(function(version) {
71
- return version + 1;
72
- }, 0);
73
62
  var registrationRef = React.useRef(null);
74
63
  var initialRegistration = React.useRef({
75
64
  value,
76
65
  disabled,
77
66
  textValue: textValueProp
78
67
  });
79
- (0, import_constants.useIsomorphicLayoutEffect)(function() {
80
- return registry.subscribe(function() {
81
- return rerenderRegistry();
82
- });
83
- }, [registry]);
84
68
  (0, import_constants.useIsomorphicLayoutEffect)(function() {
85
69
  var registration = registry.registerItem(initialRegistration.current);
86
70
  registrationRef.current = registration;
87
- var registeredNode = itemNodeRef.current;
88
- registration.setNode(registeredNode);
89
- var registeredIndex = registry.getItems().findIndex(function(item) {
90
- return item.id === registration.id;
91
- });
92
- if (import_constants.isWeb && listRef && registeredIndex >= 0 && _instanceof(registeredNode, HTMLElement)) {
93
- listRef.current[registeredIndex] = registeredNode;
94
- }
71
+ registration.setNode(itemNodeRef.current);
95
72
  return function() {
96
- var currentIndex = registry.getItems().findIndex(function(item) {
97
- return item.id === registration.id;
98
- });
99
- if (listRef && currentIndex >= 0 && listRef.current[currentIndex] === registeredNode) {
100
- listRef.current[currentIndex] = null;
101
- }
102
73
  registrationRef.current = null;
103
74
  registration.unregister();
104
75
  };
@@ -119,39 +90,37 @@ var SelectItem = (0, import_core.createStyledHOC)(SelectItemFrame, function Sele
119
90
  var _registrationRef_current;
120
91
  (_registrationRef_current = registrationRef.current) === null || _registrationRef_current === void 0 ? void 0 : _registrationRef_current.setNode(itemNodeRef.current);
121
92
  });
122
- var index = registry.getIndex(value);
93
+ var [isActive, setIsActive] = React.useState(false);
94
+ var isActiveRef = React.useRef(false);
123
95
  React.useEffect(function() {
124
96
  var handleActiveIndex = function(i) {
125
- if (index === i) {
126
- if (import_constants.isWeb) {
127
- requestAnimationFrame(function() {
128
- var _listRef_current_index;
129
- listRef === null || listRef === void 0 ? void 0 : (_listRef_current_index = listRef.current[index]) === null || _listRef_current_index === void 0 ? void 0 : _listRef_current_index.focus();
130
- });
131
- }
97
+ var next = i != null && registry.getIndex(value) === i;
98
+ if (next !== isActiveRef.current) {
99
+ isActiveRef.current = next;
100
+ setIsActive(next);
101
+ }
102
+ if (next && import_constants.isWeb) {
103
+ requestAnimationFrame(function() {
104
+ var _itemNodeRef_current_focus, _itemNodeRef_current;
105
+ (_itemNodeRef_current = itemNodeRef.current) === null || _itemNodeRef_current === void 0 ? void 0 : (_itemNodeRef_current_focus = _itemNodeRef_current.focus) === null || _itemNodeRef_current_focus === void 0 ? void 0 : _itemNodeRef_current_focus.call(_itemNodeRef_current);
106
+ });
132
107
  }
133
108
  };
134
- var currentActiveIndex = activeIndexRef === null || activeIndexRef === void 0 ? void 0 : activeIndexRef.current;
135
- if (currentActiveIndex !== null && currentActiveIndex !== void 0) {
136
- handleActiveIndex(currentActiveIndex);
137
- }
109
+ var _activeIndexRef_current;
110
+ handleActiveIndex((_activeIndexRef_current = activeIndexRef === null || activeIndexRef === void 0 ? void 0 : activeIndexRef.current) !== null && _activeIndexRef_current !== void 0 ? _activeIndexRef_current : null);
138
111
  return activeIndexSubscribe(handleActiveIndex);
139
112
  }, [
140
113
  activeIndexRef,
141
114
  activeIndexSubscribe,
142
- index,
143
- listRef
115
+ registry,
116
+ value
144
117
  ]);
145
118
  var textId = React.useId();
146
119
  var refCallback = React.useCallback(function(node) {
147
120
  var _registrationRef_current;
148
121
  itemNodeRef.current = node;
149
122
  (_registrationRef_current = registrationRef.current) === null || _registrationRef_current === void 0 ? void 0 : _registrationRef_current.setNode(node);
150
- if (!import_constants.isWeb) return;
151
- if (listRef && index >= 0) {
152
- listRef.current[index] = _instanceof(node, HTMLElement) ? node : null;
153
- }
154
- }, [index, listRef]);
123
+ }, []);
155
124
  var composedRefs = (0, import_compose_refs.useComposedRefs)(forwardedRef, refCallback);
156
125
  var handleSelect = React.useCallback(function(event) {
157
126
  var reason = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "item-press";
@@ -163,6 +132,27 @@ var SelectItem = (0, import_core.createStyledHOC)(SelectItemFrame, function Sele
163
132
  selectValue,
164
133
  value
165
134
  ]);
135
+ var handleMouseMove = React.useCallback(function(event) {
136
+ if (disabled) return;
137
+ var index = registry.getIndex(value);
138
+ if (index < 0) return;
139
+ var last = lastPointerRef.current;
140
+ if (event.clientX === last.x && event.clientY === last.y) return;
141
+ last.x = event.clientX;
142
+ last.y = event.clientY;
143
+ setActiveIndex(index, {
144
+ reason: "item-hover",
145
+ event: event.nativeEvent || event,
146
+ trigger: event.currentTarget,
147
+ index
148
+ });
149
+ }, [
150
+ disabled,
151
+ lastPointerRef,
152
+ registry,
153
+ setActiveIndex,
154
+ value
155
+ ]);
166
156
  var handleKeyDown = React.useCallback(function(event) {
167
157
  var _event_key;
168
158
  if (disabled) return;
@@ -177,7 +167,7 @@ var SelectItem = (0, import_core.createStyledHOC)(SelectItemFrame, function Sele
177
167
  moveActive(event.key === "ArrowDown" ? 1 : -1, event.nativeEvent || event);
178
168
  return;
179
169
  }
180
- if (!interactions && ((_event_key = event.key) === null || _event_key === void 0 ? void 0 : _event_key.length) === 1 && !event.metaKey && !event.ctrlKey) {
170
+ if (!getItemProps && ((_event_key = event.key) === null || _event_key === void 0 ? void 0 : _event_key.length) === 1 && !event.metaKey && !event.ctrlKey) {
181
171
  search(event.key, event.nativeEvent || event);
182
172
  }
183
173
  if (allowSelectRef) {
@@ -187,14 +177,14 @@ var SelectItem = (0, import_core.createStyledHOC)(SelectItemFrame, function Sele
187
177
  allowSelectRef,
188
178
  disabled,
189
179
  handleSelect,
190
- interactions,
180
+ getItemProps,
191
181
  moveActive,
192
182
  search
193
183
  ]);
194
184
  var selectItemProps = React.useMemo(function() {
195
- if (interactions) {
185
+ if (getItemProps) {
196
186
  var { onTouchMove, onTouchEnd, onKeyDown, onClick, onMouseUp, onMouseMove, onPress, ...itemProps } = restProps;
197
- var interactionProps = interactions.getItemProps({
187
+ var interactionProps = getItemProps({
198
188
  ...itemProps,
199
189
  onTouchMove() {
200
190
  allowSelectRef.current = true;
@@ -204,15 +194,7 @@ var SelectItem = (0, import_core.createStyledHOC)(SelectItemFrame, function Sele
204
194
  allowSelectRef.current = false;
205
195
  allowMouseUpRef.current = true;
206
196
  },
207
- onMouseMove(event) {
208
- if (disabled || index < 0) return;
209
- setActiveIndexFast === null || setActiveIndexFast === void 0 ? void 0 : setActiveIndexFast(index, {
210
- reason: "item-hover",
211
- event: event.nativeEvent || event,
212
- trigger: event.currentTarget,
213
- index
214
- });
215
- },
197
+ onMouseMove: handleMouseMove,
216
198
  onKeyDown: handleKeyDown,
217
199
  onClick(event) {
218
200
  if (disabled) return;
@@ -266,15 +248,7 @@ var SelectItem = (0, import_core.createStyledHOC)(SelectItemFrame, function Sele
266
248
  return {
267
249
  ...restProps,
268
250
  onKeyDown: (0, import_helpers.composeEventHandlers)(restProps.onKeyDown, handleKeyDown),
269
- onMouseMove: (0, import_helpers.composeEventHandlers)(restProps.onMouseMove, function(event) {
270
- if (disabled || index < 0) return;
271
- setActiveIndexFast === null || setActiveIndexFast === void 0 ? void 0 : setActiveIndexFast(index, {
272
- reason: "item-hover",
273
- event: event.nativeEvent || event,
274
- trigger: event.currentTarget,
275
- index
276
- });
277
- }),
251
+ onMouseMove: (0, import_helpers.composeEventHandlers)(restProps.onMouseMove, handleMouseMove),
278
252
  onPress: (0, import_helpers.composeEventHandlers)(restProps.onPress, handleSelect)
279
253
  };
280
254
  }, [
@@ -282,15 +256,13 @@ var SelectItem = (0, import_core.createStyledHOC)(SelectItemFrame, function Sele
282
256
  allowSelectRef,
283
257
  disabled,
284
258
  handleKeyDown,
259
+ handleMouseMove,
285
260
  handleSelect,
286
- index,
287
- interactions,
261
+ getItemProps,
288
262
  restProps,
289
- selectTimeoutRef,
290
- setActiveIndexFast
263
+ selectTimeoutRef
291
264
  ]);
292
265
  var accessibilityProps = (0, import_selectionController.getSelectOptionProps)(mode, isSelected, disabled, import_constants.isWeb ? "web" : "native");
293
- var _selectContext_activeIndex;
294
266
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectItemContextProvider, {
295
267
  scope,
296
268
  value,
@@ -307,7 +279,7 @@ var SelectItem = (0, import_core.createStyledHOC)(SelectItemFrame, function Sele
307
279
  "aria-labelledby": textId,
308
280
  "data-state": isSelected ? "active" : "inactive",
309
281
  "data-disabled": disabled ? "" : void 0,
310
- tabIndex: disabled ? void 0 : import_constants.isWeb && isAdapted ? index === ((_selectContext_activeIndex = selectContext.activeIndex) !== null && _selectContext_activeIndex !== void 0 ? _selectContext_activeIndex : selectContext.selectedIndex) ? 0 : -1 : -1,
282
+ tabIndex: disabled ? void 0 : import_constants.isWeb && isAdapted && (isActive || (activeIndexRef === null || activeIndexRef === void 0 ? void 0 : activeIndexRef.current) == null && isSelected) ? 0 : -1,
311
283
  zIndex: 100,
312
284
  ...selectItemProps,
313
285
  ...accessibilityProps