@yoopta/themes-shadcn 6.0.1 → 6.0.2

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