groove-dev 0.22.8 → 0.22.10

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 (123) hide show
  1. package/node_modules/@groove-dev/daemon/src/api.js +9 -2
  2. package/node_modules/@groove-dev/gui/dist/assets/{index-DHaSTu1c.css → index-CCGYUyEa.css} +1 -1
  3. package/node_modules/@groove-dev/gui/dist/assets/index-CMvht38D.js +574 -0
  4. package/node_modules/@groove-dev/gui/dist/index.html +2 -2
  5. package/node_modules/@groove-dev/gui/src/components/agents/agent-feed.jsx +4 -4
  6. package/node_modules/@groove-dev/gui/src/views/agents.jsx +8 -1
  7. package/package.json +1 -1
  8. package/packages/daemon/src/api.js +9 -2
  9. package/packages/gui/dist/assets/{index-DHaSTu1c.css → index-CCGYUyEa.css} +1 -1
  10. package/packages/gui/dist/assets/index-CMvht38D.js +574 -0
  11. package/packages/gui/dist/index.html +2 -2
  12. package/packages/gui/src/components/agents/agent-feed.jsx +4 -4
  13. package/packages/gui/src/views/agents.jsx +8 -1
  14. package/node_modules/@groove-dev/gui/dist/assets/index-CTKfkH67.js +0 -574
  15. package/packages/gui/dist/assets/index-CTKfkH67.js +0 -574
  16. package/packages/gui/node_modules/.vite/deps/@codemirror_autocomplete.js +0 -68
  17. package/packages/gui/node_modules/.vite/deps/@codemirror_autocomplete.js.map +0 -7
  18. package/packages/gui/node_modules/.vite/deps/@codemirror_commands.js +0 -1420
  19. package/packages/gui/node_modules/.vite/deps/@codemirror_commands.js.map +0 -7
  20. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-css.js +0 -17
  21. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-css.js.map +0 -7
  22. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-html.js +0 -22
  23. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-html.js.map +0 -7
  24. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-javascript.js +0 -34
  25. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-javascript.js.map +0 -7
  26. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-json.js +0 -101
  27. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-json.js.map +0 -7
  28. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-markdown.js +0 -2534
  29. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-markdown.js.map +0 -7
  30. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-python.js +0 -789
  31. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-python.js.map +0 -7
  32. package/packages/gui/node_modules/.vite/deps/@codemirror_language.js +0 -115
  33. package/packages/gui/node_modules/.vite/deps/@codemirror_language.js.map +0 -7
  34. package/packages/gui/node_modules/.vite/deps/@codemirror_search.js +0 -1136
  35. package/packages/gui/node_modules/.vite/deps/@codemirror_search.js.map +0 -7
  36. package/packages/gui/node_modules/.vite/deps/@codemirror_state.js +0 -63
  37. package/packages/gui/node_modules/.vite/deps/@codemirror_state.js.map +0 -7
  38. package/packages/gui/node_modules/.vite/deps/@codemirror_theme-one-dark.js +0 -179
  39. package/packages/gui/node_modules/.vite/deps/@codemirror_theme-one-dark.js.map +0 -7
  40. package/packages/gui/node_modules/.vite/deps/@codemirror_view.js +0 -104
  41. package/packages/gui/node_modules/.vite/deps/@codemirror_view.js.map +0 -7
  42. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-dialog.js +0 -367
  43. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-dialog.js.map +0 -7
  44. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-scroll-area.js +0 -755
  45. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-scroll-area.js.map +0 -7
  46. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-select.js +0 -1254
  47. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-select.js.map +0 -7
  48. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-tabs.js +0 -436
  49. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-tabs.js.map +0 -7
  50. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-tooltip.js +0 -531
  51. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-tooltip.js.map +0 -7
  52. package/packages/gui/node_modules/.vite/deps/@xterm_addon-fit.js +0 -46
  53. package/packages/gui/node_modules/.vite/deps/@xterm_addon-fit.js.map +0 -7
  54. package/packages/gui/node_modules/.vite/deps/@xterm_addon-web-links.js +0 -121
  55. package/packages/gui/node_modules/.vite/deps/@xterm_addon-web-links.js.map +0 -7
  56. package/packages/gui/node_modules/.vite/deps/@xterm_xterm.js +0 -9237
  57. package/packages/gui/node_modules/.vite/deps/@xterm_xterm.js.map +0 -7
  58. package/packages/gui/node_modules/.vite/deps/@xyflow_react.js +0 -9934
  59. package/packages/gui/node_modules/.vite/deps/@xyflow_react.js.map +0 -7
  60. package/packages/gui/node_modules/.vite/deps/_metadata.json +0 -265
  61. package/packages/gui/node_modules/.vite/deps/chunk-3EE34IFC.js +0 -5169
  62. package/packages/gui/node_modules/.vite/deps/chunk-3EE34IFC.js.map +0 -7
  63. package/packages/gui/node_modules/.vite/deps/chunk-3IB5EUP7.js +0 -2000
  64. package/packages/gui/node_modules/.vite/deps/chunk-3IB5EUP7.js.map +0 -7
  65. package/packages/gui/node_modules/.vite/deps/chunk-3LBP22MX.js +0 -1115
  66. package/packages/gui/node_modules/.vite/deps/chunk-3LBP22MX.js.map +0 -7
  67. package/packages/gui/node_modules/.vite/deps/chunk-3Q7HT7ZF.js +0 -701
  68. package/packages/gui/node_modules/.vite/deps/chunk-3Q7HT7ZF.js.map +0 -7
  69. package/packages/gui/node_modules/.vite/deps/chunk-44CLUOQE.js +0 -1776
  70. package/packages/gui/node_modules/.vite/deps/chunk-44CLUOQE.js.map +0 -7
  71. package/packages/gui/node_modules/.vite/deps/chunk-6DLNZUA5.js +0 -142
  72. package/packages/gui/node_modules/.vite/deps/chunk-6DLNZUA5.js.map +0 -7
  73. package/packages/gui/node_modules/.vite/deps/chunk-ACEP5X2F.js +0 -292
  74. package/packages/gui/node_modules/.vite/deps/chunk-ACEP5X2F.js.map +0 -7
  75. package/packages/gui/node_modules/.vite/deps/chunk-AZUN7XMC.js +0 -87
  76. package/packages/gui/node_modules/.vite/deps/chunk-AZUN7XMC.js.map +0 -7
  77. package/packages/gui/node_modules/.vite/deps/chunk-CDLO3JFW.js +0 -1004
  78. package/packages/gui/node_modules/.vite/deps/chunk-CDLO3JFW.js.map +0 -7
  79. package/packages/gui/node_modules/.vite/deps/chunk-HPXOV7QR.js +0 -23
  80. package/packages/gui/node_modules/.vite/deps/chunk-HPXOV7QR.js.map +0 -7
  81. package/packages/gui/node_modules/.vite/deps/chunk-HVFOBSCQ.js +0 -1062
  82. package/packages/gui/node_modules/.vite/deps/chunk-HVFOBSCQ.js.map +0 -7
  83. package/packages/gui/node_modules/.vite/deps/chunk-I2PYXDFH.js +0 -1106
  84. package/packages/gui/node_modules/.vite/deps/chunk-I2PYXDFH.js.map +0 -7
  85. package/packages/gui/node_modules/.vite/deps/chunk-JPXYHBLX.js +0 -306
  86. package/packages/gui/node_modules/.vite/deps/chunk-JPXYHBLX.js.map +0 -7
  87. package/packages/gui/node_modules/.vite/deps/chunk-JYDZ3XIW.js +0 -264
  88. package/packages/gui/node_modules/.vite/deps/chunk-JYDZ3XIW.js.map +0 -7
  89. package/packages/gui/node_modules/.vite/deps/chunk-PR4QN5HX.js +0 -42
  90. package/packages/gui/node_modules/.vite/deps/chunk-PR4QN5HX.js.map +0 -7
  91. package/packages/gui/node_modules/.vite/deps/chunk-QZQGPDRM.js +0 -2328
  92. package/packages/gui/node_modules/.vite/deps/chunk-QZQGPDRM.js.map +0 -7
  93. package/packages/gui/node_modules/.vite/deps/chunk-RE2FU7ZU.js +0 -10985
  94. package/packages/gui/node_modules/.vite/deps/chunk-RE2FU7ZU.js.map +0 -7
  95. package/packages/gui/node_modules/.vite/deps/chunk-UO4Y2XXS.js +0 -105
  96. package/packages/gui/node_modules/.vite/deps/chunk-UO4Y2XXS.js.map +0 -7
  97. package/packages/gui/node_modules/.vite/deps/chunk-VW6LO3QI.js +0 -9
  98. package/packages/gui/node_modules/.vite/deps/chunk-VW6LO3QI.js.map +0 -7
  99. package/packages/gui/node_modules/.vite/deps/chunk-YAD7VOVN.js +0 -280
  100. package/packages/gui/node_modules/.vite/deps/chunk-YAD7VOVN.js.map +0 -7
  101. package/packages/gui/node_modules/.vite/deps/chunk-YYJMNVCJ.js +0 -3459
  102. package/packages/gui/node_modules/.vite/deps/chunk-YYJMNVCJ.js.map +0 -7
  103. package/packages/gui/node_modules/.vite/deps/clsx.js +0 -22
  104. package/packages/gui/node_modules/.vite/deps/clsx.js.map +0 -7
  105. package/packages/gui/node_modules/.vite/deps/framer-motion.js +0 -12732
  106. package/packages/gui/node_modules/.vite/deps/framer-motion.js.map +0 -7
  107. package/packages/gui/node_modules/.vite/deps/lucide-react.js +0 -29653
  108. package/packages/gui/node_modules/.vite/deps/lucide-react.js.map +0 -7
  109. package/packages/gui/node_modules/.vite/deps/package.json +0 -3
  110. package/packages/gui/node_modules/.vite/deps/react-dom.js +0 -6
  111. package/packages/gui/node_modules/.vite/deps/react-dom.js.map +0 -7
  112. package/packages/gui/node_modules/.vite/deps/react-dom_client.js +0 -20217
  113. package/packages/gui/node_modules/.vite/deps/react-dom_client.js.map +0 -7
  114. package/packages/gui/node_modules/.vite/deps/react.js +0 -5
  115. package/packages/gui/node_modules/.vite/deps/react.js.map +0 -7
  116. package/packages/gui/node_modules/.vite/deps/react_jsx-dev-runtime.js +0 -278
  117. package/packages/gui/node_modules/.vite/deps/react_jsx-dev-runtime.js.map +0 -7
  118. package/packages/gui/node_modules/.vite/deps/react_jsx-runtime.js +0 -6
  119. package/packages/gui/node_modules/.vite/deps/react_jsx-runtime.js.map +0 -7
  120. package/packages/gui/node_modules/.vite/deps/tailwind-merge.js +0 -3263
  121. package/packages/gui/node_modules/.vite/deps/tailwind-merge.js.map +0 -7
  122. package/packages/gui/node_modules/.vite/deps/zustand.js +0 -56
  123. package/packages/gui/node_modules/.vite/deps/zustand.js.map +0 -7
@@ -1,1254 +0,0 @@
1
- "use client";
2
- import {
3
- createCollection
4
- } from "./chunk-AZUN7XMC.js";
5
- import {
6
- clamp
7
- } from "./chunk-VW6LO3QI.js";
8
- import {
9
- useDirection
10
- } from "./chunk-HPXOV7QR.js";
11
- import {
12
- Anchor,
13
- Arrow,
14
- Content,
15
- Root2,
16
- VISUALLY_HIDDEN_STYLES,
17
- createPopperScope
18
- } from "./chunk-QZQGPDRM.js";
19
- import {
20
- Combination_default,
21
- FocusScope,
22
- hideOthers,
23
- useFocusGuards
24
- } from "./chunk-I2PYXDFH.js";
25
- import {
26
- DismissableLayer,
27
- Portal
28
- } from "./chunk-JYDZ3XIW.js";
29
- import {
30
- useControllableState,
31
- useId
32
- } from "./chunk-UO4Y2XXS.js";
33
- import {
34
- Primitive,
35
- composeEventHandlers,
36
- createContextScope,
37
- createSlot,
38
- useCallbackRef,
39
- useComposedRefs,
40
- useLayoutEffect2
41
- } from "./chunk-JPXYHBLX.js";
42
- import {
43
- require_react_dom
44
- } from "./chunk-YAD7VOVN.js";
45
- import {
46
- require_jsx_runtime
47
- } from "./chunk-ACEP5X2F.js";
48
- import {
49
- require_react
50
- } from "./chunk-CDLO3JFW.js";
51
- import {
52
- __toESM
53
- } from "./chunk-PR4QN5HX.js";
54
-
55
- // ../../node_modules/@radix-ui/react-select/dist/index.mjs
56
- var React2 = __toESM(require_react(), 1);
57
- var ReactDOM = __toESM(require_react_dom(), 1);
58
-
59
- // ../../node_modules/@radix-ui/react-use-previous/dist/index.mjs
60
- var React = __toESM(require_react(), 1);
61
- function usePrevious(value) {
62
- const ref = React.useRef({ value, previous: value });
63
- return React.useMemo(() => {
64
- if (ref.current.value !== value) {
65
- ref.current.previous = ref.current.value;
66
- ref.current.value = value;
67
- }
68
- return ref.current.previous;
69
- }, [value]);
70
- }
71
-
72
- // ../../node_modules/@radix-ui/react-select/dist/index.mjs
73
- var import_jsx_runtime = __toESM(require_jsx_runtime(), 1);
74
- var OPEN_KEYS = [" ", "Enter", "ArrowUp", "ArrowDown"];
75
- var SELECTION_KEYS = [" ", "Enter"];
76
- var SELECT_NAME = "Select";
77
- var [Collection, useCollection, createCollectionScope] = createCollection(SELECT_NAME);
78
- var [createSelectContext, createSelectScope] = createContextScope(SELECT_NAME, [
79
- createCollectionScope,
80
- createPopperScope
81
- ]);
82
- var usePopperScope = createPopperScope();
83
- var [SelectProvider, useSelectContext] = createSelectContext(SELECT_NAME);
84
- var [SelectNativeOptionsProvider, useSelectNativeOptionsContext] = createSelectContext(SELECT_NAME);
85
- var Select = (props) => {
86
- const {
87
- __scopeSelect,
88
- children,
89
- open: openProp,
90
- defaultOpen,
91
- onOpenChange,
92
- value: valueProp,
93
- defaultValue,
94
- onValueChange,
95
- dir,
96
- name,
97
- autoComplete,
98
- disabled,
99
- required,
100
- form
101
- } = props;
102
- const popperScope = usePopperScope(__scopeSelect);
103
- const [trigger, setTrigger] = React2.useState(null);
104
- const [valueNode, setValueNode] = React2.useState(null);
105
- const [valueNodeHasChildren, setValueNodeHasChildren] = React2.useState(false);
106
- const direction = useDirection(dir);
107
- const [open, setOpen] = useControllableState({
108
- prop: openProp,
109
- defaultProp: defaultOpen ?? false,
110
- onChange: onOpenChange,
111
- caller: SELECT_NAME
112
- });
113
- const [value, setValue] = useControllableState({
114
- prop: valueProp,
115
- defaultProp: defaultValue,
116
- onChange: onValueChange,
117
- caller: SELECT_NAME
118
- });
119
- const triggerPointerDownPosRef = React2.useRef(null);
120
- const isFormControl = trigger ? form || !!trigger.closest("form") : true;
121
- const [nativeOptionsSet, setNativeOptionsSet] = React2.useState(/* @__PURE__ */ new Set());
122
- const nativeSelectKey = Array.from(nativeOptionsSet).map((option) => option.props.value).join(";");
123
- return (0, import_jsx_runtime.jsx)(Root2, { ...popperScope, children: (0, import_jsx_runtime.jsxs)(
124
- SelectProvider,
125
- {
126
- required,
127
- scope: __scopeSelect,
128
- trigger,
129
- onTriggerChange: setTrigger,
130
- valueNode,
131
- onValueNodeChange: setValueNode,
132
- valueNodeHasChildren,
133
- onValueNodeHasChildrenChange: setValueNodeHasChildren,
134
- contentId: useId(),
135
- value,
136
- onValueChange: setValue,
137
- open,
138
- onOpenChange: setOpen,
139
- dir: direction,
140
- triggerPointerDownPosRef,
141
- disabled,
142
- children: [
143
- (0, import_jsx_runtime.jsx)(Collection.Provider, { scope: __scopeSelect, children: (0, import_jsx_runtime.jsx)(
144
- SelectNativeOptionsProvider,
145
- {
146
- scope: props.__scopeSelect,
147
- onNativeOptionAdd: React2.useCallback((option) => {
148
- setNativeOptionsSet((prev) => new Set(prev).add(option));
149
- }, []),
150
- onNativeOptionRemove: React2.useCallback((option) => {
151
- setNativeOptionsSet((prev) => {
152
- const optionsSet = new Set(prev);
153
- optionsSet.delete(option);
154
- return optionsSet;
155
- });
156
- }, []),
157
- children
158
- }
159
- ) }),
160
- isFormControl ? (0, import_jsx_runtime.jsxs)(
161
- SelectBubbleInput,
162
- {
163
- "aria-hidden": true,
164
- required,
165
- tabIndex: -1,
166
- name,
167
- autoComplete,
168
- value,
169
- onChange: (event) => setValue(event.target.value),
170
- disabled,
171
- form,
172
- children: [
173
- value === void 0 ? (0, import_jsx_runtime.jsx)("option", { value: "" }) : null,
174
- Array.from(nativeOptionsSet)
175
- ]
176
- },
177
- nativeSelectKey
178
- ) : null
179
- ]
180
- }
181
- ) });
182
- };
183
- Select.displayName = SELECT_NAME;
184
- var TRIGGER_NAME = "SelectTrigger";
185
- var SelectTrigger = React2.forwardRef(
186
- (props, forwardedRef) => {
187
- const { __scopeSelect, disabled = false, ...triggerProps } = props;
188
- const popperScope = usePopperScope(__scopeSelect);
189
- const context = useSelectContext(TRIGGER_NAME, __scopeSelect);
190
- const isDisabled = context.disabled || disabled;
191
- const composedRefs = useComposedRefs(forwardedRef, context.onTriggerChange);
192
- const getItems = useCollection(__scopeSelect);
193
- const pointerTypeRef = React2.useRef("touch");
194
- const [searchRef, handleTypeaheadSearch, resetTypeahead] = useTypeaheadSearch((search) => {
195
- const enabledItems = getItems().filter((item) => !item.disabled);
196
- const currentItem = enabledItems.find((item) => item.value === context.value);
197
- const nextItem = findNextItem(enabledItems, search, currentItem);
198
- if (nextItem !== void 0) {
199
- context.onValueChange(nextItem.value);
200
- }
201
- });
202
- const handleOpen = (pointerEvent) => {
203
- if (!isDisabled) {
204
- context.onOpenChange(true);
205
- resetTypeahead();
206
- }
207
- if (pointerEvent) {
208
- context.triggerPointerDownPosRef.current = {
209
- x: Math.round(pointerEvent.pageX),
210
- y: Math.round(pointerEvent.pageY)
211
- };
212
- }
213
- };
214
- return (0, import_jsx_runtime.jsx)(Anchor, { asChild: true, ...popperScope, children: (0, import_jsx_runtime.jsx)(
215
- Primitive.button,
216
- {
217
- type: "button",
218
- role: "combobox",
219
- "aria-controls": context.contentId,
220
- "aria-expanded": context.open,
221
- "aria-required": context.required,
222
- "aria-autocomplete": "none",
223
- dir: context.dir,
224
- "data-state": context.open ? "open" : "closed",
225
- disabled: isDisabled,
226
- "data-disabled": isDisabled ? "" : void 0,
227
- "data-placeholder": shouldShowPlaceholder(context.value) ? "" : void 0,
228
- ...triggerProps,
229
- ref: composedRefs,
230
- onClick: composeEventHandlers(triggerProps.onClick, (event) => {
231
- event.currentTarget.focus();
232
- if (pointerTypeRef.current !== "mouse") {
233
- handleOpen(event);
234
- }
235
- }),
236
- onPointerDown: composeEventHandlers(triggerProps.onPointerDown, (event) => {
237
- pointerTypeRef.current = event.pointerType;
238
- const target = event.target;
239
- if (target.hasPointerCapture(event.pointerId)) {
240
- target.releasePointerCapture(event.pointerId);
241
- }
242
- if (event.button === 0 && event.ctrlKey === false && event.pointerType === "mouse") {
243
- handleOpen(event);
244
- event.preventDefault();
245
- }
246
- }),
247
- onKeyDown: composeEventHandlers(triggerProps.onKeyDown, (event) => {
248
- const isTypingAhead = searchRef.current !== "";
249
- const isModifierKey = event.ctrlKey || event.altKey || event.metaKey;
250
- if (!isModifierKey && event.key.length === 1) handleTypeaheadSearch(event.key);
251
- if (isTypingAhead && event.key === " ") return;
252
- if (OPEN_KEYS.includes(event.key)) {
253
- handleOpen();
254
- event.preventDefault();
255
- }
256
- })
257
- }
258
- ) });
259
- }
260
- );
261
- SelectTrigger.displayName = TRIGGER_NAME;
262
- var VALUE_NAME = "SelectValue";
263
- var SelectValue = React2.forwardRef(
264
- (props, forwardedRef) => {
265
- const { __scopeSelect, className, style, children, placeholder = "", ...valueProps } = props;
266
- const context = useSelectContext(VALUE_NAME, __scopeSelect);
267
- const { onValueNodeHasChildrenChange } = context;
268
- const hasChildren = children !== void 0;
269
- const composedRefs = useComposedRefs(forwardedRef, context.onValueNodeChange);
270
- useLayoutEffect2(() => {
271
- onValueNodeHasChildrenChange(hasChildren);
272
- }, [onValueNodeHasChildrenChange, hasChildren]);
273
- return (0, import_jsx_runtime.jsx)(
274
- Primitive.span,
275
- {
276
- ...valueProps,
277
- ref: composedRefs,
278
- style: { pointerEvents: "none" },
279
- children: shouldShowPlaceholder(context.value) ? (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: placeholder }) : children
280
- }
281
- );
282
- }
283
- );
284
- SelectValue.displayName = VALUE_NAME;
285
- var ICON_NAME = "SelectIcon";
286
- var SelectIcon = React2.forwardRef(
287
- (props, forwardedRef) => {
288
- const { __scopeSelect, children, ...iconProps } = props;
289
- return (0, import_jsx_runtime.jsx)(Primitive.span, { "aria-hidden": true, ...iconProps, ref: forwardedRef, children: children || "▼" });
290
- }
291
- );
292
- SelectIcon.displayName = ICON_NAME;
293
- var PORTAL_NAME = "SelectPortal";
294
- var SelectPortal = (props) => {
295
- return (0, import_jsx_runtime.jsx)(Portal, { asChild: true, ...props });
296
- };
297
- SelectPortal.displayName = PORTAL_NAME;
298
- var CONTENT_NAME = "SelectContent";
299
- var SelectContent = React2.forwardRef(
300
- (props, forwardedRef) => {
301
- const context = useSelectContext(CONTENT_NAME, props.__scopeSelect);
302
- const [fragment, setFragment] = React2.useState();
303
- useLayoutEffect2(() => {
304
- setFragment(new DocumentFragment());
305
- }, []);
306
- if (!context.open) {
307
- const frag = fragment;
308
- return frag ? ReactDOM.createPortal(
309
- (0, import_jsx_runtime.jsx)(SelectContentProvider, { scope: props.__scopeSelect, children: (0, import_jsx_runtime.jsx)(Collection.Slot, { scope: props.__scopeSelect, children: (0, import_jsx_runtime.jsx)("div", { children: props.children }) }) }),
310
- frag
311
- ) : null;
312
- }
313
- return (0, import_jsx_runtime.jsx)(SelectContentImpl, { ...props, ref: forwardedRef });
314
- }
315
- );
316
- SelectContent.displayName = CONTENT_NAME;
317
- var CONTENT_MARGIN = 10;
318
- var [SelectContentProvider, useSelectContentContext] = createSelectContext(CONTENT_NAME);
319
- var CONTENT_IMPL_NAME = "SelectContentImpl";
320
- var Slot = createSlot("SelectContent.RemoveScroll");
321
- var SelectContentImpl = React2.forwardRef(
322
- (props, forwardedRef) => {
323
- const {
324
- __scopeSelect,
325
- position = "item-aligned",
326
- onCloseAutoFocus,
327
- onEscapeKeyDown,
328
- onPointerDownOutside,
329
- //
330
- // PopperContent props
331
- side,
332
- sideOffset,
333
- align,
334
- alignOffset,
335
- arrowPadding,
336
- collisionBoundary,
337
- collisionPadding,
338
- sticky,
339
- hideWhenDetached,
340
- avoidCollisions,
341
- //
342
- ...contentProps
343
- } = props;
344
- const context = useSelectContext(CONTENT_NAME, __scopeSelect);
345
- const [content, setContent] = React2.useState(null);
346
- const [viewport, setViewport] = React2.useState(null);
347
- const composedRefs = useComposedRefs(forwardedRef, (node) => setContent(node));
348
- const [selectedItem, setSelectedItem] = React2.useState(null);
349
- const [selectedItemText, setSelectedItemText] = React2.useState(
350
- null
351
- );
352
- const getItems = useCollection(__scopeSelect);
353
- const [isPositioned, setIsPositioned] = React2.useState(false);
354
- const firstValidItemFoundRef = React2.useRef(false);
355
- React2.useEffect(() => {
356
- if (content) return hideOthers(content);
357
- }, [content]);
358
- useFocusGuards();
359
- const focusFirst = React2.useCallback(
360
- (candidates) => {
361
- const [firstItem, ...restItems] = getItems().map((item) => item.ref.current);
362
- const [lastItem] = restItems.slice(-1);
363
- const PREVIOUSLY_FOCUSED_ELEMENT = document.activeElement;
364
- for (const candidate of candidates) {
365
- if (candidate === PREVIOUSLY_FOCUSED_ELEMENT) return;
366
- candidate == null ? void 0 : candidate.scrollIntoView({ block: "nearest" });
367
- if (candidate === firstItem && viewport) viewport.scrollTop = 0;
368
- if (candidate === lastItem && viewport) viewport.scrollTop = viewport.scrollHeight;
369
- candidate == null ? void 0 : candidate.focus();
370
- if (document.activeElement !== PREVIOUSLY_FOCUSED_ELEMENT) return;
371
- }
372
- },
373
- [getItems, viewport]
374
- );
375
- const focusSelectedItem = React2.useCallback(
376
- () => focusFirst([selectedItem, content]),
377
- [focusFirst, selectedItem, content]
378
- );
379
- React2.useEffect(() => {
380
- if (isPositioned) {
381
- focusSelectedItem();
382
- }
383
- }, [isPositioned, focusSelectedItem]);
384
- const { onOpenChange, triggerPointerDownPosRef } = context;
385
- React2.useEffect(() => {
386
- if (content) {
387
- let pointerMoveDelta = { x: 0, y: 0 };
388
- const handlePointerMove = (event) => {
389
- var _a, _b;
390
- pointerMoveDelta = {
391
- x: Math.abs(Math.round(event.pageX) - (((_a = triggerPointerDownPosRef.current) == null ? void 0 : _a.x) ?? 0)),
392
- y: Math.abs(Math.round(event.pageY) - (((_b = triggerPointerDownPosRef.current) == null ? void 0 : _b.y) ?? 0))
393
- };
394
- };
395
- const handlePointerUp = (event) => {
396
- if (pointerMoveDelta.x <= 10 && pointerMoveDelta.y <= 10) {
397
- event.preventDefault();
398
- } else {
399
- if (!content.contains(event.target)) {
400
- onOpenChange(false);
401
- }
402
- }
403
- document.removeEventListener("pointermove", handlePointerMove);
404
- triggerPointerDownPosRef.current = null;
405
- };
406
- if (triggerPointerDownPosRef.current !== null) {
407
- document.addEventListener("pointermove", handlePointerMove);
408
- document.addEventListener("pointerup", handlePointerUp, { capture: true, once: true });
409
- }
410
- return () => {
411
- document.removeEventListener("pointermove", handlePointerMove);
412
- document.removeEventListener("pointerup", handlePointerUp, { capture: true });
413
- };
414
- }
415
- }, [content, onOpenChange, triggerPointerDownPosRef]);
416
- React2.useEffect(() => {
417
- const close = () => onOpenChange(false);
418
- window.addEventListener("blur", close);
419
- window.addEventListener("resize", close);
420
- return () => {
421
- window.removeEventListener("blur", close);
422
- window.removeEventListener("resize", close);
423
- };
424
- }, [onOpenChange]);
425
- const [searchRef, handleTypeaheadSearch] = useTypeaheadSearch((search) => {
426
- const enabledItems = getItems().filter((item) => !item.disabled);
427
- const currentItem = enabledItems.find((item) => item.ref.current === document.activeElement);
428
- const nextItem = findNextItem(enabledItems, search, currentItem);
429
- if (nextItem) {
430
- setTimeout(() => nextItem.ref.current.focus());
431
- }
432
- });
433
- const itemRefCallback = React2.useCallback(
434
- (node, value, disabled) => {
435
- const isFirstValidItem = !firstValidItemFoundRef.current && !disabled;
436
- const isSelectedItem = context.value !== void 0 && context.value === value;
437
- if (isSelectedItem || isFirstValidItem) {
438
- setSelectedItem(node);
439
- if (isFirstValidItem) firstValidItemFoundRef.current = true;
440
- }
441
- },
442
- [context.value]
443
- );
444
- const handleItemLeave = React2.useCallback(() => content == null ? void 0 : content.focus(), [content]);
445
- const itemTextRefCallback = React2.useCallback(
446
- (node, value, disabled) => {
447
- const isFirstValidItem = !firstValidItemFoundRef.current && !disabled;
448
- const isSelectedItem = context.value !== void 0 && context.value === value;
449
- if (isSelectedItem || isFirstValidItem) {
450
- setSelectedItemText(node);
451
- }
452
- },
453
- [context.value]
454
- );
455
- const SelectPosition = position === "popper" ? SelectPopperPosition : SelectItemAlignedPosition;
456
- const popperContentProps = SelectPosition === SelectPopperPosition ? {
457
- side,
458
- sideOffset,
459
- align,
460
- alignOffset,
461
- arrowPadding,
462
- collisionBoundary,
463
- collisionPadding,
464
- sticky,
465
- hideWhenDetached,
466
- avoidCollisions
467
- } : {};
468
- return (0, import_jsx_runtime.jsx)(
469
- SelectContentProvider,
470
- {
471
- scope: __scopeSelect,
472
- content,
473
- viewport,
474
- onViewportChange: setViewport,
475
- itemRefCallback,
476
- selectedItem,
477
- onItemLeave: handleItemLeave,
478
- itemTextRefCallback,
479
- focusSelectedItem,
480
- selectedItemText,
481
- position,
482
- isPositioned,
483
- searchRef,
484
- children: (0, import_jsx_runtime.jsx)(Combination_default, { as: Slot, allowPinchZoom: true, children: (0, import_jsx_runtime.jsx)(
485
- FocusScope,
486
- {
487
- asChild: true,
488
- trapped: context.open,
489
- onMountAutoFocus: (event) => {
490
- event.preventDefault();
491
- },
492
- onUnmountAutoFocus: composeEventHandlers(onCloseAutoFocus, (event) => {
493
- var _a;
494
- (_a = context.trigger) == null ? void 0 : _a.focus({ preventScroll: true });
495
- event.preventDefault();
496
- }),
497
- children: (0, import_jsx_runtime.jsx)(
498
- DismissableLayer,
499
- {
500
- asChild: true,
501
- disableOutsidePointerEvents: true,
502
- onEscapeKeyDown,
503
- onPointerDownOutside,
504
- onFocusOutside: (event) => event.preventDefault(),
505
- onDismiss: () => context.onOpenChange(false),
506
- children: (0, import_jsx_runtime.jsx)(
507
- SelectPosition,
508
- {
509
- role: "listbox",
510
- id: context.contentId,
511
- "data-state": context.open ? "open" : "closed",
512
- dir: context.dir,
513
- onContextMenu: (event) => event.preventDefault(),
514
- ...contentProps,
515
- ...popperContentProps,
516
- onPlaced: () => setIsPositioned(true),
517
- ref: composedRefs,
518
- style: {
519
- // flex layout so we can place the scroll buttons properly
520
- display: "flex",
521
- flexDirection: "column",
522
- // reset the outline by default as the content MAY get focused
523
- outline: "none",
524
- ...contentProps.style
525
- },
526
- onKeyDown: composeEventHandlers(contentProps.onKeyDown, (event) => {
527
- const isModifierKey = event.ctrlKey || event.altKey || event.metaKey;
528
- if (event.key === "Tab") event.preventDefault();
529
- if (!isModifierKey && event.key.length === 1) handleTypeaheadSearch(event.key);
530
- if (["ArrowUp", "ArrowDown", "Home", "End"].includes(event.key)) {
531
- const items = getItems().filter((item) => !item.disabled);
532
- let candidateNodes = items.map((item) => item.ref.current);
533
- if (["ArrowUp", "End"].includes(event.key)) {
534
- candidateNodes = candidateNodes.slice().reverse();
535
- }
536
- if (["ArrowUp", "ArrowDown"].includes(event.key)) {
537
- const currentElement = event.target;
538
- const currentIndex = candidateNodes.indexOf(currentElement);
539
- candidateNodes = candidateNodes.slice(currentIndex + 1);
540
- }
541
- setTimeout(() => focusFirst(candidateNodes));
542
- event.preventDefault();
543
- }
544
- })
545
- }
546
- )
547
- }
548
- )
549
- }
550
- ) })
551
- }
552
- );
553
- }
554
- );
555
- SelectContentImpl.displayName = CONTENT_IMPL_NAME;
556
- var ITEM_ALIGNED_POSITION_NAME = "SelectItemAlignedPosition";
557
- var SelectItemAlignedPosition = React2.forwardRef((props, forwardedRef) => {
558
- const { __scopeSelect, onPlaced, ...popperProps } = props;
559
- const context = useSelectContext(CONTENT_NAME, __scopeSelect);
560
- const contentContext = useSelectContentContext(CONTENT_NAME, __scopeSelect);
561
- const [contentWrapper, setContentWrapper] = React2.useState(null);
562
- const [content, setContent] = React2.useState(null);
563
- const composedRefs = useComposedRefs(forwardedRef, (node) => setContent(node));
564
- const getItems = useCollection(__scopeSelect);
565
- const shouldExpandOnScrollRef = React2.useRef(false);
566
- const shouldRepositionRef = React2.useRef(true);
567
- const { viewport, selectedItem, selectedItemText, focusSelectedItem } = contentContext;
568
- const position = React2.useCallback(() => {
569
- if (context.trigger && context.valueNode && contentWrapper && content && viewport && selectedItem && selectedItemText) {
570
- const triggerRect = context.trigger.getBoundingClientRect();
571
- const contentRect = content.getBoundingClientRect();
572
- const valueNodeRect = context.valueNode.getBoundingClientRect();
573
- const itemTextRect = selectedItemText.getBoundingClientRect();
574
- if (context.dir !== "rtl") {
575
- const itemTextOffset = itemTextRect.left - contentRect.left;
576
- const left = valueNodeRect.left - itemTextOffset;
577
- const leftDelta = triggerRect.left - left;
578
- const minContentWidth = triggerRect.width + leftDelta;
579
- const contentWidth = Math.max(minContentWidth, contentRect.width);
580
- const rightEdge = window.innerWidth - CONTENT_MARGIN;
581
- const clampedLeft = clamp(left, [
582
- CONTENT_MARGIN,
583
- // Prevents the content from going off the starting edge of the
584
- // viewport. It may still go off the ending edge, but this can be
585
- // controlled by the user since they may want to manage overflow in a
586
- // specific way.
587
- // https://github.com/radix-ui/primitives/issues/2049
588
- Math.max(CONTENT_MARGIN, rightEdge - contentWidth)
589
- ]);
590
- contentWrapper.style.minWidth = minContentWidth + "px";
591
- contentWrapper.style.left = clampedLeft + "px";
592
- } else {
593
- const itemTextOffset = contentRect.right - itemTextRect.right;
594
- const right = window.innerWidth - valueNodeRect.right - itemTextOffset;
595
- const rightDelta = window.innerWidth - triggerRect.right - right;
596
- const minContentWidth = triggerRect.width + rightDelta;
597
- const contentWidth = Math.max(minContentWidth, contentRect.width);
598
- const leftEdge = window.innerWidth - CONTENT_MARGIN;
599
- const clampedRight = clamp(right, [
600
- CONTENT_MARGIN,
601
- Math.max(CONTENT_MARGIN, leftEdge - contentWidth)
602
- ]);
603
- contentWrapper.style.minWidth = minContentWidth + "px";
604
- contentWrapper.style.right = clampedRight + "px";
605
- }
606
- const items = getItems();
607
- const availableHeight = window.innerHeight - CONTENT_MARGIN * 2;
608
- const itemsHeight = viewport.scrollHeight;
609
- const contentStyles = window.getComputedStyle(content);
610
- const contentBorderTopWidth = parseInt(contentStyles.borderTopWidth, 10);
611
- const contentPaddingTop = parseInt(contentStyles.paddingTop, 10);
612
- const contentBorderBottomWidth = parseInt(contentStyles.borderBottomWidth, 10);
613
- const contentPaddingBottom = parseInt(contentStyles.paddingBottom, 10);
614
- const fullContentHeight = contentBorderTopWidth + contentPaddingTop + itemsHeight + contentPaddingBottom + contentBorderBottomWidth;
615
- const minContentHeight = Math.min(selectedItem.offsetHeight * 5, fullContentHeight);
616
- const viewportStyles = window.getComputedStyle(viewport);
617
- const viewportPaddingTop = parseInt(viewportStyles.paddingTop, 10);
618
- const viewportPaddingBottom = parseInt(viewportStyles.paddingBottom, 10);
619
- const topEdgeToTriggerMiddle = triggerRect.top + triggerRect.height / 2 - CONTENT_MARGIN;
620
- const triggerMiddleToBottomEdge = availableHeight - topEdgeToTriggerMiddle;
621
- const selectedItemHalfHeight = selectedItem.offsetHeight / 2;
622
- const itemOffsetMiddle = selectedItem.offsetTop + selectedItemHalfHeight;
623
- const contentTopToItemMiddle = contentBorderTopWidth + contentPaddingTop + itemOffsetMiddle;
624
- const itemMiddleToContentBottom = fullContentHeight - contentTopToItemMiddle;
625
- const willAlignWithoutTopOverflow = contentTopToItemMiddle <= topEdgeToTriggerMiddle;
626
- if (willAlignWithoutTopOverflow) {
627
- const isLastItem = items.length > 0 && selectedItem === items[items.length - 1].ref.current;
628
- contentWrapper.style.bottom = "0px";
629
- const viewportOffsetBottom = content.clientHeight - viewport.offsetTop - viewport.offsetHeight;
630
- const clampedTriggerMiddleToBottomEdge = Math.max(
631
- triggerMiddleToBottomEdge,
632
- selectedItemHalfHeight + // viewport might have padding bottom, include it to avoid a scrollable viewport
633
- (isLastItem ? viewportPaddingBottom : 0) + viewportOffsetBottom + contentBorderBottomWidth
634
- );
635
- const height = contentTopToItemMiddle + clampedTriggerMiddleToBottomEdge;
636
- contentWrapper.style.height = height + "px";
637
- } else {
638
- const isFirstItem = items.length > 0 && selectedItem === items[0].ref.current;
639
- contentWrapper.style.top = "0px";
640
- const clampedTopEdgeToTriggerMiddle = Math.max(
641
- topEdgeToTriggerMiddle,
642
- contentBorderTopWidth + viewport.offsetTop + // viewport might have padding top, include it to avoid a scrollable viewport
643
- (isFirstItem ? viewportPaddingTop : 0) + selectedItemHalfHeight
644
- );
645
- const height = clampedTopEdgeToTriggerMiddle + itemMiddleToContentBottom;
646
- contentWrapper.style.height = height + "px";
647
- viewport.scrollTop = contentTopToItemMiddle - topEdgeToTriggerMiddle + viewport.offsetTop;
648
- }
649
- contentWrapper.style.margin = `${CONTENT_MARGIN}px 0`;
650
- contentWrapper.style.minHeight = minContentHeight + "px";
651
- contentWrapper.style.maxHeight = availableHeight + "px";
652
- onPlaced == null ? void 0 : onPlaced();
653
- requestAnimationFrame(() => shouldExpandOnScrollRef.current = true);
654
- }
655
- }, [
656
- getItems,
657
- context.trigger,
658
- context.valueNode,
659
- contentWrapper,
660
- content,
661
- viewport,
662
- selectedItem,
663
- selectedItemText,
664
- context.dir,
665
- onPlaced
666
- ]);
667
- useLayoutEffect2(() => position(), [position]);
668
- const [contentZIndex, setContentZIndex] = React2.useState();
669
- useLayoutEffect2(() => {
670
- if (content) setContentZIndex(window.getComputedStyle(content).zIndex);
671
- }, [content]);
672
- const handleScrollButtonChange = React2.useCallback(
673
- (node) => {
674
- if (node && shouldRepositionRef.current === true) {
675
- position();
676
- focusSelectedItem == null ? void 0 : focusSelectedItem();
677
- shouldRepositionRef.current = false;
678
- }
679
- },
680
- [position, focusSelectedItem]
681
- );
682
- return (0, import_jsx_runtime.jsx)(
683
- SelectViewportProvider,
684
- {
685
- scope: __scopeSelect,
686
- contentWrapper,
687
- shouldExpandOnScrollRef,
688
- onScrollButtonChange: handleScrollButtonChange,
689
- children: (0, import_jsx_runtime.jsx)(
690
- "div",
691
- {
692
- ref: setContentWrapper,
693
- style: {
694
- display: "flex",
695
- flexDirection: "column",
696
- position: "fixed",
697
- zIndex: contentZIndex
698
- },
699
- children: (0, import_jsx_runtime.jsx)(
700
- Primitive.div,
701
- {
702
- ...popperProps,
703
- ref: composedRefs,
704
- style: {
705
- // When we get the height of the content, it includes borders. If we were to set
706
- // the height without having `boxSizing: 'border-box'` it would be too big.
707
- boxSizing: "border-box",
708
- // We need to ensure the content doesn't get taller than the wrapper
709
- maxHeight: "100%",
710
- ...popperProps.style
711
- }
712
- }
713
- )
714
- }
715
- )
716
- }
717
- );
718
- });
719
- SelectItemAlignedPosition.displayName = ITEM_ALIGNED_POSITION_NAME;
720
- var POPPER_POSITION_NAME = "SelectPopperPosition";
721
- var SelectPopperPosition = React2.forwardRef((props, forwardedRef) => {
722
- const {
723
- __scopeSelect,
724
- align = "start",
725
- collisionPadding = CONTENT_MARGIN,
726
- ...popperProps
727
- } = props;
728
- const popperScope = usePopperScope(__scopeSelect);
729
- return (0, import_jsx_runtime.jsx)(
730
- Content,
731
- {
732
- ...popperScope,
733
- ...popperProps,
734
- ref: forwardedRef,
735
- align,
736
- collisionPadding,
737
- style: {
738
- // Ensure border-box for floating-ui calculations
739
- boxSizing: "border-box",
740
- ...popperProps.style,
741
- // re-namespace exposed content custom properties
742
- ...{
743
- "--radix-select-content-transform-origin": "var(--radix-popper-transform-origin)",
744
- "--radix-select-content-available-width": "var(--radix-popper-available-width)",
745
- "--radix-select-content-available-height": "var(--radix-popper-available-height)",
746
- "--radix-select-trigger-width": "var(--radix-popper-anchor-width)",
747
- "--radix-select-trigger-height": "var(--radix-popper-anchor-height)"
748
- }
749
- }
750
- }
751
- );
752
- });
753
- SelectPopperPosition.displayName = POPPER_POSITION_NAME;
754
- var [SelectViewportProvider, useSelectViewportContext] = createSelectContext(CONTENT_NAME, {});
755
- var VIEWPORT_NAME = "SelectViewport";
756
- var SelectViewport = React2.forwardRef(
757
- (props, forwardedRef) => {
758
- const { __scopeSelect, nonce, ...viewportProps } = props;
759
- const contentContext = useSelectContentContext(VIEWPORT_NAME, __scopeSelect);
760
- const viewportContext = useSelectViewportContext(VIEWPORT_NAME, __scopeSelect);
761
- const composedRefs = useComposedRefs(forwardedRef, contentContext.onViewportChange);
762
- const prevScrollTopRef = React2.useRef(0);
763
- return (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
764
- (0, import_jsx_runtime.jsx)(
765
- "style",
766
- {
767
- dangerouslySetInnerHTML: {
768
- __html: `[data-radix-select-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-select-viewport]::-webkit-scrollbar{display:none}`
769
- },
770
- nonce
771
- }
772
- ),
773
- (0, import_jsx_runtime.jsx)(Collection.Slot, { scope: __scopeSelect, children: (0, import_jsx_runtime.jsx)(
774
- Primitive.div,
775
- {
776
- "data-radix-select-viewport": "",
777
- role: "presentation",
778
- ...viewportProps,
779
- ref: composedRefs,
780
- style: {
781
- // we use position: 'relative' here on the `viewport` so that when we call
782
- // `selectedItem.offsetTop` in calculations, the offset is relative to the viewport
783
- // (independent of the scrollUpButton).
784
- position: "relative",
785
- flex: 1,
786
- // Viewport should only be scrollable in the vertical direction.
787
- // This won't work in vertical writing modes, so we'll need to
788
- // revisit this if/when that is supported
789
- // https://developer.chrome.com/blog/vertical-form-controls
790
- overflow: "hidden auto",
791
- ...viewportProps.style
792
- },
793
- onScroll: composeEventHandlers(viewportProps.onScroll, (event) => {
794
- const viewport = event.currentTarget;
795
- const { contentWrapper, shouldExpandOnScrollRef } = viewportContext;
796
- if ((shouldExpandOnScrollRef == null ? void 0 : shouldExpandOnScrollRef.current) && contentWrapper) {
797
- const scrolledBy = Math.abs(prevScrollTopRef.current - viewport.scrollTop);
798
- if (scrolledBy > 0) {
799
- const availableHeight = window.innerHeight - CONTENT_MARGIN * 2;
800
- const cssMinHeight = parseFloat(contentWrapper.style.minHeight);
801
- const cssHeight = parseFloat(contentWrapper.style.height);
802
- const prevHeight = Math.max(cssMinHeight, cssHeight);
803
- if (prevHeight < availableHeight) {
804
- const nextHeight = prevHeight + scrolledBy;
805
- const clampedNextHeight = Math.min(availableHeight, nextHeight);
806
- const heightDiff = nextHeight - clampedNextHeight;
807
- contentWrapper.style.height = clampedNextHeight + "px";
808
- if (contentWrapper.style.bottom === "0px") {
809
- viewport.scrollTop = heightDiff > 0 ? heightDiff : 0;
810
- contentWrapper.style.justifyContent = "flex-end";
811
- }
812
- }
813
- }
814
- }
815
- prevScrollTopRef.current = viewport.scrollTop;
816
- })
817
- }
818
- ) })
819
- ] });
820
- }
821
- );
822
- SelectViewport.displayName = VIEWPORT_NAME;
823
- var GROUP_NAME = "SelectGroup";
824
- var [SelectGroupContextProvider, useSelectGroupContext] = createSelectContext(GROUP_NAME);
825
- var SelectGroup = React2.forwardRef(
826
- (props, forwardedRef) => {
827
- const { __scopeSelect, ...groupProps } = props;
828
- const groupId = useId();
829
- return (0, import_jsx_runtime.jsx)(SelectGroupContextProvider, { scope: __scopeSelect, id: groupId, children: (0, import_jsx_runtime.jsx)(Primitive.div, { role: "group", "aria-labelledby": groupId, ...groupProps, ref: forwardedRef }) });
830
- }
831
- );
832
- SelectGroup.displayName = GROUP_NAME;
833
- var LABEL_NAME = "SelectLabel";
834
- var SelectLabel = React2.forwardRef(
835
- (props, forwardedRef) => {
836
- const { __scopeSelect, ...labelProps } = props;
837
- const groupContext = useSelectGroupContext(LABEL_NAME, __scopeSelect);
838
- return (0, import_jsx_runtime.jsx)(Primitive.div, { id: groupContext.id, ...labelProps, ref: forwardedRef });
839
- }
840
- );
841
- SelectLabel.displayName = LABEL_NAME;
842
- var ITEM_NAME = "SelectItem";
843
- var [SelectItemContextProvider, useSelectItemContext] = createSelectContext(ITEM_NAME);
844
- var SelectItem = React2.forwardRef(
845
- (props, forwardedRef) => {
846
- const {
847
- __scopeSelect,
848
- value,
849
- disabled = false,
850
- textValue: textValueProp,
851
- ...itemProps
852
- } = props;
853
- const context = useSelectContext(ITEM_NAME, __scopeSelect);
854
- const contentContext = useSelectContentContext(ITEM_NAME, __scopeSelect);
855
- const isSelected = context.value === value;
856
- const [textValue, setTextValue] = React2.useState(textValueProp ?? "");
857
- const [isFocused, setIsFocused] = React2.useState(false);
858
- const composedRefs = useComposedRefs(
859
- forwardedRef,
860
- (node) => {
861
- var _a;
862
- return (_a = contentContext.itemRefCallback) == null ? void 0 : _a.call(contentContext, node, value, disabled);
863
- }
864
- );
865
- const textId = useId();
866
- const pointerTypeRef = React2.useRef("touch");
867
- const handleSelect = () => {
868
- if (!disabled) {
869
- context.onValueChange(value);
870
- context.onOpenChange(false);
871
- }
872
- };
873
- if (value === "") {
874
- throw new Error(
875
- "A <Select.Item /> must have a value prop that is not an empty string. This is because the Select value can be set to an empty string to clear the selection and show the placeholder."
876
- );
877
- }
878
- return (0, import_jsx_runtime.jsx)(
879
- SelectItemContextProvider,
880
- {
881
- scope: __scopeSelect,
882
- value,
883
- disabled,
884
- textId,
885
- isSelected,
886
- onItemTextChange: React2.useCallback((node) => {
887
- setTextValue((prevTextValue) => prevTextValue || ((node == null ? void 0 : node.textContent) ?? "").trim());
888
- }, []),
889
- children: (0, import_jsx_runtime.jsx)(
890
- Collection.ItemSlot,
891
- {
892
- scope: __scopeSelect,
893
- value,
894
- disabled,
895
- textValue,
896
- children: (0, import_jsx_runtime.jsx)(
897
- Primitive.div,
898
- {
899
- role: "option",
900
- "aria-labelledby": textId,
901
- "data-highlighted": isFocused ? "" : void 0,
902
- "aria-selected": isSelected && isFocused,
903
- "data-state": isSelected ? "checked" : "unchecked",
904
- "aria-disabled": disabled || void 0,
905
- "data-disabled": disabled ? "" : void 0,
906
- tabIndex: disabled ? void 0 : -1,
907
- ...itemProps,
908
- ref: composedRefs,
909
- onFocus: composeEventHandlers(itemProps.onFocus, () => setIsFocused(true)),
910
- onBlur: composeEventHandlers(itemProps.onBlur, () => setIsFocused(false)),
911
- onClick: composeEventHandlers(itemProps.onClick, () => {
912
- if (pointerTypeRef.current !== "mouse") handleSelect();
913
- }),
914
- onPointerUp: composeEventHandlers(itemProps.onPointerUp, () => {
915
- if (pointerTypeRef.current === "mouse") handleSelect();
916
- }),
917
- onPointerDown: composeEventHandlers(itemProps.onPointerDown, (event) => {
918
- pointerTypeRef.current = event.pointerType;
919
- }),
920
- onPointerMove: composeEventHandlers(itemProps.onPointerMove, (event) => {
921
- var _a;
922
- pointerTypeRef.current = event.pointerType;
923
- if (disabled) {
924
- (_a = contentContext.onItemLeave) == null ? void 0 : _a.call(contentContext);
925
- } else if (pointerTypeRef.current === "mouse") {
926
- event.currentTarget.focus({ preventScroll: true });
927
- }
928
- }),
929
- onPointerLeave: composeEventHandlers(itemProps.onPointerLeave, (event) => {
930
- var _a;
931
- if (event.currentTarget === document.activeElement) {
932
- (_a = contentContext.onItemLeave) == null ? void 0 : _a.call(contentContext);
933
- }
934
- }),
935
- onKeyDown: composeEventHandlers(itemProps.onKeyDown, (event) => {
936
- var _a;
937
- const isTypingAhead = ((_a = contentContext.searchRef) == null ? void 0 : _a.current) !== "";
938
- if (isTypingAhead && event.key === " ") return;
939
- if (SELECTION_KEYS.includes(event.key)) handleSelect();
940
- if (event.key === " ") event.preventDefault();
941
- })
942
- }
943
- )
944
- }
945
- )
946
- }
947
- );
948
- }
949
- );
950
- SelectItem.displayName = ITEM_NAME;
951
- var ITEM_TEXT_NAME = "SelectItemText";
952
- var SelectItemText = React2.forwardRef(
953
- (props, forwardedRef) => {
954
- const { __scopeSelect, className, style, ...itemTextProps } = props;
955
- const context = useSelectContext(ITEM_TEXT_NAME, __scopeSelect);
956
- const contentContext = useSelectContentContext(ITEM_TEXT_NAME, __scopeSelect);
957
- const itemContext = useSelectItemContext(ITEM_TEXT_NAME, __scopeSelect);
958
- const nativeOptionsContext = useSelectNativeOptionsContext(ITEM_TEXT_NAME, __scopeSelect);
959
- const [itemTextNode, setItemTextNode] = React2.useState(null);
960
- const composedRefs = useComposedRefs(
961
- forwardedRef,
962
- (node) => setItemTextNode(node),
963
- itemContext.onItemTextChange,
964
- (node) => {
965
- var _a;
966
- return (_a = contentContext.itemTextRefCallback) == null ? void 0 : _a.call(contentContext, node, itemContext.value, itemContext.disabled);
967
- }
968
- );
969
- const textContent = itemTextNode == null ? void 0 : itemTextNode.textContent;
970
- const nativeOption = React2.useMemo(
971
- () => (0, import_jsx_runtime.jsx)("option", { value: itemContext.value, disabled: itemContext.disabled, children: textContent }, itemContext.value),
972
- [itemContext.disabled, itemContext.value, textContent]
973
- );
974
- const { onNativeOptionAdd, onNativeOptionRemove } = nativeOptionsContext;
975
- useLayoutEffect2(() => {
976
- onNativeOptionAdd(nativeOption);
977
- return () => onNativeOptionRemove(nativeOption);
978
- }, [onNativeOptionAdd, onNativeOptionRemove, nativeOption]);
979
- return (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
980
- (0, import_jsx_runtime.jsx)(Primitive.span, { id: itemContext.textId, ...itemTextProps, ref: composedRefs }),
981
- itemContext.isSelected && context.valueNode && !context.valueNodeHasChildren ? ReactDOM.createPortal(itemTextProps.children, context.valueNode) : null
982
- ] });
983
- }
984
- );
985
- SelectItemText.displayName = ITEM_TEXT_NAME;
986
- var ITEM_INDICATOR_NAME = "SelectItemIndicator";
987
- var SelectItemIndicator = React2.forwardRef(
988
- (props, forwardedRef) => {
989
- const { __scopeSelect, ...itemIndicatorProps } = props;
990
- const itemContext = useSelectItemContext(ITEM_INDICATOR_NAME, __scopeSelect);
991
- return itemContext.isSelected ? (0, import_jsx_runtime.jsx)(Primitive.span, { "aria-hidden": true, ...itemIndicatorProps, ref: forwardedRef }) : null;
992
- }
993
- );
994
- SelectItemIndicator.displayName = ITEM_INDICATOR_NAME;
995
- var SCROLL_UP_BUTTON_NAME = "SelectScrollUpButton";
996
- var SelectScrollUpButton = React2.forwardRef((props, forwardedRef) => {
997
- const contentContext = useSelectContentContext(SCROLL_UP_BUTTON_NAME, props.__scopeSelect);
998
- const viewportContext = useSelectViewportContext(SCROLL_UP_BUTTON_NAME, props.__scopeSelect);
999
- const [canScrollUp, setCanScrollUp] = React2.useState(false);
1000
- const composedRefs = useComposedRefs(forwardedRef, viewportContext.onScrollButtonChange);
1001
- useLayoutEffect2(() => {
1002
- if (contentContext.viewport && contentContext.isPositioned) {
1003
- let handleScroll2 = function() {
1004
- const canScrollUp2 = viewport.scrollTop > 0;
1005
- setCanScrollUp(canScrollUp2);
1006
- };
1007
- var handleScroll = handleScroll2;
1008
- const viewport = contentContext.viewport;
1009
- handleScroll2();
1010
- viewport.addEventListener("scroll", handleScroll2);
1011
- return () => viewport.removeEventListener("scroll", handleScroll2);
1012
- }
1013
- }, [contentContext.viewport, contentContext.isPositioned]);
1014
- return canScrollUp ? (0, import_jsx_runtime.jsx)(
1015
- SelectScrollButtonImpl,
1016
- {
1017
- ...props,
1018
- ref: composedRefs,
1019
- onAutoScroll: () => {
1020
- const { viewport, selectedItem } = contentContext;
1021
- if (viewport && selectedItem) {
1022
- viewport.scrollTop = viewport.scrollTop - selectedItem.offsetHeight;
1023
- }
1024
- }
1025
- }
1026
- ) : null;
1027
- });
1028
- SelectScrollUpButton.displayName = SCROLL_UP_BUTTON_NAME;
1029
- var SCROLL_DOWN_BUTTON_NAME = "SelectScrollDownButton";
1030
- var SelectScrollDownButton = React2.forwardRef((props, forwardedRef) => {
1031
- const contentContext = useSelectContentContext(SCROLL_DOWN_BUTTON_NAME, props.__scopeSelect);
1032
- const viewportContext = useSelectViewportContext(SCROLL_DOWN_BUTTON_NAME, props.__scopeSelect);
1033
- const [canScrollDown, setCanScrollDown] = React2.useState(false);
1034
- const composedRefs = useComposedRefs(forwardedRef, viewportContext.onScrollButtonChange);
1035
- useLayoutEffect2(() => {
1036
- if (contentContext.viewport && contentContext.isPositioned) {
1037
- let handleScroll2 = function() {
1038
- const maxScroll = viewport.scrollHeight - viewport.clientHeight;
1039
- const canScrollDown2 = Math.ceil(viewport.scrollTop) < maxScroll;
1040
- setCanScrollDown(canScrollDown2);
1041
- };
1042
- var handleScroll = handleScroll2;
1043
- const viewport = contentContext.viewport;
1044
- handleScroll2();
1045
- viewport.addEventListener("scroll", handleScroll2);
1046
- return () => viewport.removeEventListener("scroll", handleScroll2);
1047
- }
1048
- }, [contentContext.viewport, contentContext.isPositioned]);
1049
- return canScrollDown ? (0, import_jsx_runtime.jsx)(
1050
- SelectScrollButtonImpl,
1051
- {
1052
- ...props,
1053
- ref: composedRefs,
1054
- onAutoScroll: () => {
1055
- const { viewport, selectedItem } = contentContext;
1056
- if (viewport && selectedItem) {
1057
- viewport.scrollTop = viewport.scrollTop + selectedItem.offsetHeight;
1058
- }
1059
- }
1060
- }
1061
- ) : null;
1062
- });
1063
- SelectScrollDownButton.displayName = SCROLL_DOWN_BUTTON_NAME;
1064
- var SelectScrollButtonImpl = React2.forwardRef((props, forwardedRef) => {
1065
- const { __scopeSelect, onAutoScroll, ...scrollIndicatorProps } = props;
1066
- const contentContext = useSelectContentContext("SelectScrollButton", __scopeSelect);
1067
- const autoScrollTimerRef = React2.useRef(null);
1068
- const getItems = useCollection(__scopeSelect);
1069
- const clearAutoScrollTimer = React2.useCallback(() => {
1070
- if (autoScrollTimerRef.current !== null) {
1071
- window.clearInterval(autoScrollTimerRef.current);
1072
- autoScrollTimerRef.current = null;
1073
- }
1074
- }, []);
1075
- React2.useEffect(() => {
1076
- return () => clearAutoScrollTimer();
1077
- }, [clearAutoScrollTimer]);
1078
- useLayoutEffect2(() => {
1079
- var _a;
1080
- const activeItem = getItems().find((item) => item.ref.current === document.activeElement);
1081
- (_a = activeItem == null ? void 0 : activeItem.ref.current) == null ? void 0 : _a.scrollIntoView({ block: "nearest" });
1082
- }, [getItems]);
1083
- return (0, import_jsx_runtime.jsx)(
1084
- Primitive.div,
1085
- {
1086
- "aria-hidden": true,
1087
- ...scrollIndicatorProps,
1088
- ref: forwardedRef,
1089
- style: { flexShrink: 0, ...scrollIndicatorProps.style },
1090
- onPointerDown: composeEventHandlers(scrollIndicatorProps.onPointerDown, () => {
1091
- if (autoScrollTimerRef.current === null) {
1092
- autoScrollTimerRef.current = window.setInterval(onAutoScroll, 50);
1093
- }
1094
- }),
1095
- onPointerMove: composeEventHandlers(scrollIndicatorProps.onPointerMove, () => {
1096
- var _a;
1097
- (_a = contentContext.onItemLeave) == null ? void 0 : _a.call(contentContext);
1098
- if (autoScrollTimerRef.current === null) {
1099
- autoScrollTimerRef.current = window.setInterval(onAutoScroll, 50);
1100
- }
1101
- }),
1102
- onPointerLeave: composeEventHandlers(scrollIndicatorProps.onPointerLeave, () => {
1103
- clearAutoScrollTimer();
1104
- })
1105
- }
1106
- );
1107
- });
1108
- var SEPARATOR_NAME = "SelectSeparator";
1109
- var SelectSeparator = React2.forwardRef(
1110
- (props, forwardedRef) => {
1111
- const { __scopeSelect, ...separatorProps } = props;
1112
- return (0, import_jsx_runtime.jsx)(Primitive.div, { "aria-hidden": true, ...separatorProps, ref: forwardedRef });
1113
- }
1114
- );
1115
- SelectSeparator.displayName = SEPARATOR_NAME;
1116
- var ARROW_NAME = "SelectArrow";
1117
- var SelectArrow = React2.forwardRef(
1118
- (props, forwardedRef) => {
1119
- const { __scopeSelect, ...arrowProps } = props;
1120
- const popperScope = usePopperScope(__scopeSelect);
1121
- const context = useSelectContext(ARROW_NAME, __scopeSelect);
1122
- const contentContext = useSelectContentContext(ARROW_NAME, __scopeSelect);
1123
- return context.open && contentContext.position === "popper" ? (0, import_jsx_runtime.jsx)(Arrow, { ...popperScope, ...arrowProps, ref: forwardedRef }) : null;
1124
- }
1125
- );
1126
- SelectArrow.displayName = ARROW_NAME;
1127
- var BUBBLE_INPUT_NAME = "SelectBubbleInput";
1128
- var SelectBubbleInput = React2.forwardRef(
1129
- ({ __scopeSelect, value, ...props }, forwardedRef) => {
1130
- const ref = React2.useRef(null);
1131
- const composedRefs = useComposedRefs(forwardedRef, ref);
1132
- const prevValue = usePrevious(value);
1133
- React2.useEffect(() => {
1134
- const select = ref.current;
1135
- if (!select) return;
1136
- const selectProto = window.HTMLSelectElement.prototype;
1137
- const descriptor = Object.getOwnPropertyDescriptor(
1138
- selectProto,
1139
- "value"
1140
- );
1141
- const setValue = descriptor.set;
1142
- if (prevValue !== value && setValue) {
1143
- const event = new Event("change", { bubbles: true });
1144
- setValue.call(select, value);
1145
- select.dispatchEvent(event);
1146
- }
1147
- }, [prevValue, value]);
1148
- return (0, import_jsx_runtime.jsx)(
1149
- Primitive.select,
1150
- {
1151
- ...props,
1152
- style: { ...VISUALLY_HIDDEN_STYLES, ...props.style },
1153
- ref: composedRefs,
1154
- defaultValue: value
1155
- }
1156
- );
1157
- }
1158
- );
1159
- SelectBubbleInput.displayName = BUBBLE_INPUT_NAME;
1160
- function shouldShowPlaceholder(value) {
1161
- return value === "" || value === void 0;
1162
- }
1163
- function useTypeaheadSearch(onSearchChange) {
1164
- const handleSearchChange = useCallbackRef(onSearchChange);
1165
- const searchRef = React2.useRef("");
1166
- const timerRef = React2.useRef(0);
1167
- const handleTypeaheadSearch = React2.useCallback(
1168
- (key) => {
1169
- const search = searchRef.current + key;
1170
- handleSearchChange(search);
1171
- (function updateSearch(value) {
1172
- searchRef.current = value;
1173
- window.clearTimeout(timerRef.current);
1174
- if (value !== "") timerRef.current = window.setTimeout(() => updateSearch(""), 1e3);
1175
- })(search);
1176
- },
1177
- [handleSearchChange]
1178
- );
1179
- const resetTypeahead = React2.useCallback(() => {
1180
- searchRef.current = "";
1181
- window.clearTimeout(timerRef.current);
1182
- }, []);
1183
- React2.useEffect(() => {
1184
- return () => window.clearTimeout(timerRef.current);
1185
- }, []);
1186
- return [searchRef, handleTypeaheadSearch, resetTypeahead];
1187
- }
1188
- function findNextItem(items, search, currentItem) {
1189
- const isRepeated = search.length > 1 && Array.from(search).every((char) => char === search[0]);
1190
- const normalizedSearch = isRepeated ? search[0] : search;
1191
- const currentItemIndex = currentItem ? items.indexOf(currentItem) : -1;
1192
- let wrappedItems = wrapArray(items, Math.max(currentItemIndex, 0));
1193
- const excludeCurrentItem = normalizedSearch.length === 1;
1194
- if (excludeCurrentItem) wrappedItems = wrappedItems.filter((v) => v !== currentItem);
1195
- const nextItem = wrappedItems.find(
1196
- (item) => item.textValue.toLowerCase().startsWith(normalizedSearch.toLowerCase())
1197
- );
1198
- return nextItem !== currentItem ? nextItem : void 0;
1199
- }
1200
- function wrapArray(array, startIndex) {
1201
- return array.map((_, index) => array[(startIndex + index) % array.length]);
1202
- }
1203
- var Root22 = Select;
1204
- var Trigger = SelectTrigger;
1205
- var Value = SelectValue;
1206
- var Icon = SelectIcon;
1207
- var Portal2 = SelectPortal;
1208
- var Content2 = SelectContent;
1209
- var Viewport = SelectViewport;
1210
- var Group = SelectGroup;
1211
- var Label = SelectLabel;
1212
- var Item = SelectItem;
1213
- var ItemText = SelectItemText;
1214
- var ItemIndicator = SelectItemIndicator;
1215
- var ScrollUpButton = SelectScrollUpButton;
1216
- var ScrollDownButton = SelectScrollDownButton;
1217
- var Separator = SelectSeparator;
1218
- var Arrow2 = SelectArrow;
1219
- export {
1220
- Arrow2 as Arrow,
1221
- Content2 as Content,
1222
- Group,
1223
- Icon,
1224
- Item,
1225
- ItemIndicator,
1226
- ItemText,
1227
- Label,
1228
- Portal2 as Portal,
1229
- Root22 as Root,
1230
- ScrollDownButton,
1231
- ScrollUpButton,
1232
- Select,
1233
- SelectArrow,
1234
- SelectContent,
1235
- SelectGroup,
1236
- SelectIcon,
1237
- SelectItem,
1238
- SelectItemIndicator,
1239
- SelectItemText,
1240
- SelectLabel,
1241
- SelectPortal,
1242
- SelectScrollDownButton,
1243
- SelectScrollUpButton,
1244
- SelectSeparator,
1245
- SelectTrigger,
1246
- SelectValue,
1247
- SelectViewport,
1248
- Separator,
1249
- Trigger,
1250
- Value,
1251
- Viewport,
1252
- createSelectScope
1253
- };
1254
- //# sourceMappingURL=@radix-ui_react-select.js.map