@strapi/ui-primitives 1.7.3 → 1.7.4
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.
- package/dist/hooks/useCallbackRef.d.ts +1 -0
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +392 -382
- package/package.json +8 -2
package/dist/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as d, jsxs as Ne, Fragment as Ae } from "react/jsx-runtime";
|
|
2
|
-
import * as
|
|
2
|
+
import * as l from "react";
|
|
3
3
|
import { composeEventHandlers as E } from "@radix-ui/primitive";
|
|
4
4
|
import { useComposedRefs as _ } from "@radix-ui/react-compose-refs";
|
|
5
5
|
import { createContextScope as Qe, createContext as et } from "@radix-ui/react-context";
|
|
@@ -10,6 +10,7 @@ import { createPopperScope as ot } from "@radix-ui/react-popper";
|
|
|
10
10
|
import { Portal as nt } from "@radix-ui/react-portal";
|
|
11
11
|
import { Primitive as N } from "@radix-ui/react-primitive";
|
|
12
12
|
import { useControllableState as ie } from "@radix-ui/react-use-controllable-state";
|
|
13
|
+
import { useLayoutEffect as B } from "@radix-ui/react-use-layout-effect";
|
|
13
14
|
import { hideOthers as rt } from "aria-hidden";
|
|
14
15
|
import * as _e from "react-dom";
|
|
15
16
|
import { RemoveScroll as lt } from "react-remove-scroll";
|
|
@@ -20,12 +21,12 @@ import { useDirection as Vt } from "@radix-ui/react-direction";
|
|
|
20
21
|
import { useFocusGuards as Rt } from "@radix-ui/react-focus-guards";
|
|
21
22
|
import { FocusScope as Nt } from "@radix-ui/react-focus-scope";
|
|
22
23
|
import { useCallbackRef as At } from "@radix-ui/react-use-callback-ref";
|
|
23
|
-
import {
|
|
24
|
+
import { useCallbackRef as Rn } from "@radix-ui/react-use-callback-ref";
|
|
24
25
|
import { usePrevious as _t } from "@radix-ui/react-use-previous";
|
|
25
26
|
import { VisuallyHidden as Mt } from "@radix-ui/react-visually-hidden";
|
|
26
27
|
let ye = /* @__PURE__ */ new Map();
|
|
27
28
|
function Ot(n, s) {
|
|
28
|
-
let e = n + (s ? Object.entries(s).sort((o,
|
|
29
|
+
let e = n + (s ? Object.entries(s).sort((o, r) => o[0] < r[0] ? -1 : 1).join() : "");
|
|
29
30
|
if (ye.has(e))
|
|
30
31
|
return ye.get(e);
|
|
31
32
|
let t = new Intl.Collator(n, s);
|
|
@@ -47,9 +48,9 @@ function Me(n, s) {
|
|
|
47
48
|
if (o.length === 0)
|
|
48
49
|
return !0;
|
|
49
50
|
t = t.normalize("NFC"), o = o.normalize("NFC");
|
|
50
|
-
let
|
|
51
|
-
for (;
|
|
52
|
-
let c = t.slice(
|
|
51
|
+
let r = 0, i = o.length;
|
|
52
|
+
for (; r + i <= t.length; r++) {
|
|
53
|
+
let c = t.slice(r, r + i);
|
|
53
54
|
if (e.compare(o, c) === 0)
|
|
54
55
|
return !0;
|
|
55
56
|
}
|
|
@@ -58,113 +59,113 @@ function Me(n, s) {
|
|
|
58
59
|
};
|
|
59
60
|
}
|
|
60
61
|
const Dt = (n) => {
|
|
61
|
-
const s =
|
|
62
|
-
return
|
|
62
|
+
const s = l.useRef();
|
|
63
|
+
return l.useEffect(() => {
|
|
63
64
|
s.current = n;
|
|
64
65
|
}), s.current;
|
|
65
66
|
};
|
|
66
67
|
function kt(n) {
|
|
67
|
-
const s = `${n}CollectionProvider`, [e, t] = Qe(s), [o,
|
|
68
|
+
const s = `${n}CollectionProvider`, [e, t] = Qe(s), [o, r] = e(s, {
|
|
68
69
|
collectionRef: { current: null },
|
|
69
70
|
itemMap: /* @__PURE__ */ new Map(),
|
|
70
71
|
listeners: /* @__PURE__ */ new Set()
|
|
71
72
|
}), i = (u) => {
|
|
72
|
-
const { scope: p, children:
|
|
73
|
-
return /* @__PURE__ */ d(o, { scope: p, itemMap: v, collectionRef: C, listeners:
|
|
73
|
+
const { scope: p, children: g } = u, C = l.useRef(null), v = l.useRef(/* @__PURE__ */ new Map()).current, x = l.useRef(/* @__PURE__ */ new Set()).current;
|
|
74
|
+
return /* @__PURE__ */ d(o, { scope: p, itemMap: v, collectionRef: C, listeners: x, children: g });
|
|
74
75
|
};
|
|
75
76
|
i.displayName = s;
|
|
76
|
-
const c = `${n}CollectionSlot`, a =
|
|
77
|
-
const { scope:
|
|
78
|
-
return /* @__PURE__ */ d(Ie, { ref:
|
|
77
|
+
const c = `${n}CollectionSlot`, a = l.forwardRef((u, p) => {
|
|
78
|
+
const { scope: g, children: C } = u, v = r(c, g), x = _(p, v.collectionRef);
|
|
79
|
+
return /* @__PURE__ */ d(Ie, { ref: x, children: C });
|
|
79
80
|
});
|
|
80
81
|
a.displayName = c;
|
|
81
|
-
const m = `${n}CollectionItemSlot`, f = "data-radix-collection-item",
|
|
82
|
-
const { scope:
|
|
83
|
-
return
|
|
82
|
+
const m = `${n}CollectionItemSlot`, f = "data-radix-collection-item", S = l.forwardRef((u, p) => {
|
|
83
|
+
const { scope: g, children: C, ...v } = u, x = l.useRef(null), w = _(p, x), A = r(m, g);
|
|
84
|
+
return l.useEffect(() => {
|
|
84
85
|
const T = Array.from(A.itemMap.values());
|
|
85
|
-
return A.itemMap.set(
|
|
86
|
+
return A.itemMap.set(x, { ref: x, ...v }), A.listeners.forEach((M) => M(Array.from(A.itemMap.values()), T)), () => {
|
|
86
87
|
const M = Array.from(A.itemMap.values());
|
|
87
|
-
A.itemMap.delete(
|
|
88
|
+
A.itemMap.delete(x), A.listeners.forEach((P) => P(Array.from(A.itemMap.values()), M));
|
|
88
89
|
};
|
|
89
90
|
}), /* @__PURE__ */ d(Ie, { [f]: "", ref: w, children: C });
|
|
90
91
|
});
|
|
91
|
-
|
|
92
|
-
function
|
|
93
|
-
const p =
|
|
92
|
+
S.displayName = m;
|
|
93
|
+
function h(u) {
|
|
94
|
+
const p = r(`${n}CollectionConsumer`, u), g = l.useCallback(() => {
|
|
94
95
|
const v = p.collectionRef.current;
|
|
95
96
|
if (!v)
|
|
96
97
|
return [];
|
|
97
|
-
const
|
|
98
|
+
const x = Array.from(v.querySelectorAll(`[${f}]`));
|
|
98
99
|
return Array.from(p.itemMap.values()).sort(
|
|
99
|
-
(T, M) =>
|
|
100
|
+
(T, M) => x.indexOf(T.ref.current) - x.indexOf(M.ref.current)
|
|
100
101
|
);
|
|
101
|
-
}, [p.collectionRef, p.itemMap]), C =
|
|
102
|
+
}, [p.collectionRef, p.itemMap]), C = l.useCallback(
|
|
102
103
|
(v) => (p.listeners.add(v), () => p.listeners.delete(v)),
|
|
103
104
|
[p.listeners]
|
|
104
105
|
);
|
|
105
|
-
return { getItems:
|
|
106
|
+
return { getItems: g, subscribe: C };
|
|
106
107
|
}
|
|
107
108
|
return [
|
|
108
|
-
{ Provider: i, Slot: a, ItemSlot:
|
|
109
|
-
|
|
109
|
+
{ Provider: i, Slot: a, ItemSlot: S },
|
|
110
|
+
h,
|
|
110
111
|
t
|
|
111
112
|
];
|
|
112
113
|
}
|
|
113
|
-
const
|
|
114
|
+
const Ft = [" ", "Enter", "ArrowUp", "ArrowDown"], Lt = ["Enter"], Je = (n) => !!(n.length === 1 && n.match(/\S| /)), st = "Combobox", [pe, me] = kt(st), [Bt, j] = et(st), Ht = ({ children: n }) => /* @__PURE__ */ d(re.Root, { children: /* @__PURE__ */ d(pe.Provider, { scope: void 0, children: n }) }), $t = (n) => {
|
|
114
115
|
const {
|
|
115
116
|
allowCustomValue: s = !1,
|
|
116
117
|
autocomplete: e = "none",
|
|
117
118
|
children: t,
|
|
118
119
|
open: o,
|
|
119
|
-
defaultOpen:
|
|
120
|
+
defaultOpen: r,
|
|
120
121
|
onOpenChange: i,
|
|
121
122
|
value: c,
|
|
122
123
|
defaultValue: a,
|
|
123
124
|
onValueChange: m,
|
|
124
125
|
disabled: f,
|
|
125
|
-
required:
|
|
126
|
-
locale:
|
|
126
|
+
required: S = !1,
|
|
127
|
+
locale: h = "en-EN",
|
|
127
128
|
onTextValueChange: u,
|
|
128
129
|
textValue: p,
|
|
129
|
-
defaultTextValue:
|
|
130
|
+
defaultTextValue: g,
|
|
130
131
|
filterValue: C,
|
|
131
132
|
defaultFilterValue: v,
|
|
132
|
-
onFilterValueChange:
|
|
133
|
-
} = n, [w, A] =
|
|
133
|
+
onFilterValueChange: x
|
|
134
|
+
} = n, [w, A] = l.useState(null), [T, M] = l.useState(null), [P, k] = l.useState(null), [H, z] = l.useState(null), [$ = !1, O] = ie({
|
|
134
135
|
prop: o,
|
|
135
|
-
defaultProp:
|
|
136
|
+
defaultProp: r,
|
|
136
137
|
onChange: i
|
|
137
|
-
}), [
|
|
138
|
+
}), [F, L] = ie({
|
|
138
139
|
prop: c,
|
|
139
140
|
defaultProp: a,
|
|
140
141
|
onChange: m
|
|
141
|
-
}), [
|
|
142
|
+
}), [U, K] = ie({
|
|
142
143
|
prop: p,
|
|
143
|
-
defaultProp:
|
|
144
|
+
defaultProp: g,
|
|
144
145
|
onChange: u
|
|
145
|
-
}), [
|
|
146
|
+
}), [q, X] = ie({
|
|
146
147
|
prop: C,
|
|
147
148
|
defaultProp: v,
|
|
148
|
-
onChange:
|
|
149
|
-
}),
|
|
149
|
+
onChange: x
|
|
150
|
+
}), W = oe(), ue = l.useCallback(
|
|
150
151
|
(le, se) => {
|
|
151
|
-
const de = se.map((y) => y.ref.current), [
|
|
152
|
+
const de = se.map((y) => y.ref.current), [Z, ...ce] = de, [Q] = ce.slice(-1), b = H;
|
|
152
153
|
for (const y of le) {
|
|
153
|
-
if (y ===
|
|
154
|
+
if (y === b)
|
|
154
155
|
return;
|
|
155
|
-
if (y?.scrollIntoView({ block: "nearest" }), y ===
|
|
156
|
+
if (y?.scrollIntoView({ block: "nearest" }), y === Z && T && (T.scrollTop = 0), y === Q && T && (T.scrollTop = T.scrollHeight), z(y), e === "both") {
|
|
156
157
|
const D = se.find((I) => I.ref.current === y);
|
|
157
|
-
D &&
|
|
158
|
+
D && K(D.textValue);
|
|
158
159
|
}
|
|
159
|
-
if (y !==
|
|
160
|
+
if (y !== b)
|
|
160
161
|
return;
|
|
161
162
|
}
|
|
162
163
|
},
|
|
163
|
-
[e,
|
|
164
|
+
[e, K, T, H]
|
|
164
165
|
);
|
|
165
|
-
return
|
|
166
|
-
e !== "both" &&
|
|
167
|
-
}, [
|
|
166
|
+
return l.useEffect(() => {
|
|
167
|
+
e !== "both" && z(null);
|
|
168
|
+
}, [U, e]), l.useEffect(() => {
|
|
168
169
|
if (P && w)
|
|
169
170
|
return rt([P, w]);
|
|
170
171
|
}, [P, w]), /* @__PURE__ */ d(Ht, { children: /* @__PURE__ */ d(
|
|
@@ -172,45 +173,46 @@ const Lt = [" ", "Enter", "ArrowUp", "ArrowDown"], Ft = ["Enter"], Je = (n) => !
|
|
|
172
173
|
{
|
|
173
174
|
allowCustomValue: s,
|
|
174
175
|
autocomplete: e,
|
|
175
|
-
required:
|
|
176
|
+
required: S,
|
|
176
177
|
trigger: w,
|
|
177
178
|
onTriggerChange: A,
|
|
178
|
-
contentId:
|
|
179
|
-
value:
|
|
180
|
-
onValueChange:
|
|
181
|
-
open:
|
|
179
|
+
contentId: W,
|
|
180
|
+
value: F,
|
|
181
|
+
onValueChange: L,
|
|
182
|
+
open: $,
|
|
182
183
|
onOpenChange: O,
|
|
183
184
|
disabled: f,
|
|
184
|
-
locale:
|
|
185
|
+
locale: h,
|
|
185
186
|
focusFirst: ue,
|
|
186
|
-
textValue:
|
|
187
|
-
onTextValueChange:
|
|
187
|
+
textValue: U,
|
|
188
|
+
onTextValueChange: K,
|
|
188
189
|
onViewportChange: M,
|
|
189
190
|
onContentChange: k,
|
|
190
|
-
visuallyFocussedItem:
|
|
191
|
-
filterValue:
|
|
192
|
-
onFilterValueChange:
|
|
193
|
-
onVisuallyFocussedItemChange:
|
|
191
|
+
visuallyFocussedItem: H,
|
|
192
|
+
filterValue: q,
|
|
193
|
+
onFilterValueChange: X,
|
|
194
|
+
onVisuallyFocussedItemChange: z,
|
|
194
195
|
children: t
|
|
195
196
|
}
|
|
196
197
|
) });
|
|
197
|
-
}, Ut = "ComboboxTrigger", Kt =
|
|
198
|
-
const { ...e } = n, t =
|
|
198
|
+
}, Ut = "ComboboxTrigger", Kt = l.forwardRef((n, s) => {
|
|
199
|
+
const { ...e } = n, t = j(Ut);
|
|
199
200
|
return /* @__PURE__ */ d(re.Anchor, { asChild: !0, children: /* @__PURE__ */ d("div", { ref: s, "data-disabled": t.disabled ? "" : void 0, ...e }) });
|
|
200
|
-
}), ct = "ComboboxInput", Wt =
|
|
201
|
-
const e =
|
|
201
|
+
}), ct = "ComboboxInput", Wt = l.forwardRef((n, s) => {
|
|
202
|
+
const e = j(ct), t = l.useRef(null), { getItems: o } = me(void 0), { startsWith: r } = Me(e.locale, { sensitivity: "base" }), i = e.disabled, c = _(t, s, e.onTriggerChange), a = () => {
|
|
202
203
|
i || e.onOpenChange(!0);
|
|
203
204
|
}, m = Dt(e.filterValue);
|
|
204
|
-
return
|
|
205
|
-
setTimeout(() => {
|
|
205
|
+
return B(() => {
|
|
206
|
+
const f = setTimeout(() => {
|
|
206
207
|
if (e.textValue === "" || e.textValue === void 0 || e.filterValue === "" || e.filterValue === void 0)
|
|
207
208
|
return;
|
|
208
|
-
const
|
|
209
|
-
(
|
|
210
|
-
),
|
|
211
|
-
|
|
209
|
+
const S = o().find(
|
|
210
|
+
(u) => u.type === "option" && r(u.textValue, e.textValue)
|
|
211
|
+
), h = vo(m ?? "", e.filterValue);
|
|
212
|
+
S && !e.visuallyFocussedItem && h === e.filterValue.length && t.current.setSelectionRange(e.filterValue.length, e.textValue.length);
|
|
212
213
|
});
|
|
213
|
-
|
|
214
|
+
return () => clearTimeout(f);
|
|
215
|
+
}, [e.textValue, e.filterValue, r, e.visuallyFocussedItem, o, m]), /* @__PURE__ */ d(
|
|
214
216
|
"input",
|
|
215
217
|
{
|
|
216
218
|
type: "text",
|
|
@@ -237,24 +239,29 @@ const Lt = [" ", "Enter", "ArrowUp", "ArrowDown"], Ft = ["Enter"], Je = (n) => !
|
|
|
237
239
|
onKeyDown: E(n.onKeyDown, (f) => {
|
|
238
240
|
if (["ArrowUp", "ArrowDown", "Home", "End"].includes(f.key))
|
|
239
241
|
setTimeout(() => {
|
|
240
|
-
let
|
|
241
|
-
if (["ArrowUp", "End"].includes(f.key) && (
|
|
242
|
+
let h = o().filter((u) => !u.disabled).map((u) => u.ref.current);
|
|
243
|
+
if (["ArrowUp", "End"].includes(f.key) && (h = h.slice().reverse()), ["ArrowUp", "ArrowDown"].includes(f.key)) {
|
|
242
244
|
const u = e.visuallyFocussedItem ?? f.target;
|
|
243
|
-
let p =
|
|
244
|
-
p ===
|
|
245
|
+
let p = h.indexOf(u);
|
|
246
|
+
p === h.length - 1 && (p = -1), h = h.slice(p + 1);
|
|
245
247
|
}
|
|
246
|
-
if (["ArrowDown"].includes(f.key) && e.autocomplete === "both" &&
|
|
247
|
-
const [u, ...p] =
|
|
248
|
-
e.textValue ===
|
|
248
|
+
if (["ArrowDown"].includes(f.key) && e.autocomplete === "both" && h.length > 1) {
|
|
249
|
+
const [u, ...p] = h, g = o().find((C) => C.ref.current === u).textValue;
|
|
250
|
+
e.textValue === g && (h = p);
|
|
249
251
|
}
|
|
250
|
-
e.focusFirst(
|
|
252
|
+
e.focusFirst(h, o());
|
|
251
253
|
}), f.preventDefault();
|
|
252
254
|
else if (["Escape"].includes(f.key))
|
|
253
255
|
e.open ? e.onOpenChange(!1) : (e.onValueChange(void 0), e.onTextValueChange("")), f.preventDefault();
|
|
254
|
-
else if (
|
|
256
|
+
else if (Lt.includes(f.key)) {
|
|
255
257
|
if (e.visuallyFocussedItem) {
|
|
256
|
-
const
|
|
257
|
-
|
|
258
|
+
const S = o().find((h) => h.ref.current === e.visuallyFocussedItem);
|
|
259
|
+
S && (e.onValueChange(S.value), e.onTextValueChange(S.textValue), e.autocomplete === "both" && e.onFilterValueChange(S.textValue), S.ref.current?.click());
|
|
260
|
+
} else {
|
|
261
|
+
const S = o().find(
|
|
262
|
+
(h) => h.type === "option" && !h.disabled && h.textValue === e.textValue
|
|
263
|
+
);
|
|
264
|
+
S && (e.onValueChange(S.value), e.onTextValueChange(S.textValue), e.autocomplete === "both" && e.onFilterValueChange(S.textValue), S.ref.current?.click());
|
|
258
265
|
}
|
|
259
266
|
e.onOpenChange(!1), f.preventDefault();
|
|
260
267
|
} else
|
|
@@ -264,27 +271,29 @@ const Lt = [" ", "Enter", "ArrowUp", "ArrowDown"], Ft = ["Enter"], Je = (n) => !
|
|
|
264
271
|
e.onTextValueChange(f.currentTarget.value), e.autocomplete === "both" && e.onFilterValueChange(f.currentTarget.value);
|
|
265
272
|
}),
|
|
266
273
|
onKeyUp: E(n.onKeyUp, (f) => {
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
274
|
+
!e.open && (Je(f.key) || ["ArrowUp", "ArrowDown", "Home", "End", "Backspace"].includes(f.key)) && a(), setTimeout(() => {
|
|
275
|
+
if (e.autocomplete === "both" && Je(f.key) && e.filterValue !== void 0) {
|
|
276
|
+
const S = e.filterValue, h = o().find((u) => r(u.textValue, S));
|
|
277
|
+
h && e.onTextValueChange(h.textValue);
|
|
278
|
+
}
|
|
279
|
+
});
|
|
271
280
|
})
|
|
272
281
|
}
|
|
273
282
|
);
|
|
274
|
-
}), zt =
|
|
275
|
-
const { children: e, ...t } = n, o =
|
|
276
|
-
|
|
283
|
+
}), zt = l.forwardRef((n, s) => {
|
|
284
|
+
const { children: e, ...t } = n, o = j(ct), r = o.disabled, i = () => {
|
|
285
|
+
r || (o.onOpenChange(!0), o.trigger?.focus());
|
|
277
286
|
};
|
|
278
287
|
return /* @__PURE__ */ d(
|
|
279
288
|
N.button,
|
|
280
289
|
{
|
|
281
290
|
"aria-hidden": !0,
|
|
282
291
|
type: "button",
|
|
283
|
-
"aria-disabled":
|
|
292
|
+
"aria-disabled": r,
|
|
284
293
|
"aria-controls": o.contentId,
|
|
285
294
|
"aria-expanded": o.open,
|
|
286
|
-
disabled:
|
|
287
|
-
"data-disabled":
|
|
295
|
+
disabled: r,
|
|
296
|
+
"data-disabled": r ? "" : void 0,
|
|
288
297
|
...t,
|
|
289
298
|
tabIndex: -1,
|
|
290
299
|
ref: s,
|
|
@@ -295,43 +304,43 @@ const Lt = [" ", "Enter", "ArrowUp", "ArrowDown"], Ft = ["Enter"], Je = (n) => !
|
|
|
295
304
|
c.button === 0 && c.ctrlKey === !1 && (i(), c.preventDefault());
|
|
296
305
|
}),
|
|
297
306
|
onKeyDown: E(t.onKeyDown, (c) => {
|
|
298
|
-
|
|
307
|
+
Ft.includes(c.key) && (i(), c.preventDefault());
|
|
299
308
|
}),
|
|
300
309
|
children: e || "▼"
|
|
301
310
|
}
|
|
302
311
|
);
|
|
303
312
|
}), Gt = "ComboboxPortal", it = (n) => /* @__PURE__ */ d(nt, { asChild: !0, ...n });
|
|
304
313
|
it.displayName = Gt;
|
|
305
|
-
const at = "ComboboxContent", jt =
|
|
306
|
-
const e =
|
|
307
|
-
if (
|
|
314
|
+
const at = "ComboboxContent", jt = l.forwardRef((n, s) => {
|
|
315
|
+
const e = j(at), [t, o] = l.useState();
|
|
316
|
+
if (B(() => {
|
|
308
317
|
o(new DocumentFragment());
|
|
309
318
|
}, []), !e.open) {
|
|
310
|
-
const
|
|
311
|
-
return
|
|
319
|
+
const r = t;
|
|
320
|
+
return r ? _e.createPortal(
|
|
312
321
|
/* @__PURE__ */ d(pe.Slot, { scope: void 0, children: /* @__PURE__ */ d("div", { children: n.children }) }),
|
|
313
|
-
|
|
322
|
+
r
|
|
314
323
|
) : null;
|
|
315
324
|
}
|
|
316
325
|
return /* @__PURE__ */ d(qt, { ...n, ref: s });
|
|
317
|
-
}), Yt = 10, qt =
|
|
326
|
+
}), Yt = 10, qt = l.forwardRef(
|
|
318
327
|
(n, s) => {
|
|
319
|
-
const { onEscapeKeyDown: e, onPointerDownOutside: t, ...o } = n,
|
|
320
|
-
|
|
321
|
-
const [
|
|
322
|
-
if (
|
|
323
|
-
|
|
328
|
+
const { onEscapeKeyDown: e, onPointerDownOutside: t, ...o } = n, r = j(at), i = _(s, (g) => r.onContentChange(g)), { onOpenChange: c, onValueChange: a, onFilterValueChange: m, onTextValueChange: f, textValue: S, value: h } = r, { getItems: u } = me(void 0), p = l.useCallback(() => {
|
|
329
|
+
r.onVisuallyFocussedItemChange(null);
|
|
330
|
+
const [g] = u().filter((v) => v.textValue === S && v.type === "option");
|
|
331
|
+
if (r.allowCustomValue) {
|
|
332
|
+
g && (a(g.value), r.autocomplete === "both" && m(g.textValue));
|
|
324
333
|
return;
|
|
325
334
|
}
|
|
326
|
-
const [C] = u().filter((v) => v.value ===
|
|
327
|
-
|
|
328
|
-
}, [
|
|
329
|
-
return
|
|
330
|
-
const
|
|
335
|
+
const [C] = u().filter((v) => v.value === h && v.type === "option");
|
|
336
|
+
g ? a(g.value) : C && S !== "" ? (f(C.textValue), r.autocomplete === "both" && m(C.textValue)) : (a(void 0), f(""));
|
|
337
|
+
}, [r, u, m, f, a, S, h]);
|
|
338
|
+
return l.useEffect(() => {
|
|
339
|
+
const g = () => {
|
|
331
340
|
p(), c(!1);
|
|
332
341
|
};
|
|
333
|
-
return window.addEventListener("blur",
|
|
334
|
-
window.removeEventListener("blur",
|
|
342
|
+
return window.addEventListener("blur", g), window.addEventListener("resize", g), () => {
|
|
343
|
+
window.removeEventListener("blur", g), window.removeEventListener("resize", g);
|
|
335
344
|
};
|
|
336
345
|
}, [p, c]), /* @__PURE__ */ d(lt, { allowPinchZoom: !0, children: /* @__PURE__ */ d(
|
|
337
346
|
tt,
|
|
@@ -339,17 +348,17 @@ const at = "ComboboxContent", jt = r.forwardRef((n, s) => {
|
|
|
339
348
|
asChild: !0,
|
|
340
349
|
onEscapeKeyDown: e,
|
|
341
350
|
onPointerDownOutside: t,
|
|
342
|
-
onFocusOutside: (
|
|
351
|
+
onFocusOutside: (g) => g.preventDefault(),
|
|
343
352
|
onDismiss: () => {
|
|
344
|
-
|
|
353
|
+
r.onOpenChange(!1), r.trigger?.focus({ preventScroll: !0 }), p();
|
|
345
354
|
},
|
|
346
355
|
children: /* @__PURE__ */ d(
|
|
347
356
|
Xt,
|
|
348
357
|
{
|
|
349
358
|
role: "listbox",
|
|
350
|
-
id:
|
|
351
|
-
"data-state":
|
|
352
|
-
onContextMenu: (
|
|
359
|
+
id: r.contentId,
|
|
360
|
+
"data-state": r.open ? "open" : "closed",
|
|
361
|
+
onContextMenu: (g) => g.preventDefault(),
|
|
353
362
|
...o,
|
|
354
363
|
ref: i,
|
|
355
364
|
style: {
|
|
@@ -365,7 +374,7 @@ const at = "ComboboxContent", jt = r.forwardRef((n, s) => {
|
|
|
365
374
|
}
|
|
366
375
|
) });
|
|
367
376
|
}
|
|
368
|
-
), Xt =
|
|
377
|
+
), Xt = l.forwardRef(
|
|
369
378
|
(n, s) => {
|
|
370
379
|
const { align: e = "start", collisionPadding: t = Yt, ...o } = n;
|
|
371
380
|
return /* @__PURE__ */ d(
|
|
@@ -388,8 +397,8 @@ const at = "ComboboxContent", jt = r.forwardRef((n, s) => {
|
|
|
388
397
|
}
|
|
389
398
|
);
|
|
390
399
|
}
|
|
391
|
-
), Zt = "ComboboxViewport", Jt =
|
|
392
|
-
const e =
|
|
400
|
+
), Zt = "ComboboxViewport", Jt = l.forwardRef((n, s) => {
|
|
401
|
+
const e = j(Zt), t = _(s, e.onViewportChange);
|
|
393
402
|
return /* @__PURE__ */ Ne(Ae, { children: [
|
|
394
403
|
/* @__PURE__ */ d(
|
|
395
404
|
"style",
|
|
@@ -418,22 +427,22 @@ const at = "ComboboxContent", jt = r.forwardRef((n, s) => {
|
|
|
418
427
|
}
|
|
419
428
|
) })
|
|
420
429
|
] });
|
|
421
|
-
}), ut = "ComboboxItem", [Qt, dt] = et(ut), ft =
|
|
422
|
-
const { value: e, disabled: t = !1, textValue: o, ...
|
|
430
|
+
}), ut = "ComboboxItem", [Qt, dt] = et(ut), ft = l.forwardRef((n, s) => {
|
|
431
|
+
const { value: e, disabled: t = !1, textValue: o, ...r } = n, i = l.useRef(null), c = _(s, i), { getItems: a } = me(void 0), {
|
|
423
432
|
onTextValueChange: m,
|
|
424
433
|
textValue: f,
|
|
425
|
-
visuallyFocussedItem:
|
|
426
|
-
...
|
|
427
|
-
} =
|
|
428
|
-
t || (
|
|
429
|
-
}, { startsWith: w } = Me(
|
|
430
|
-
|
|
434
|
+
visuallyFocussedItem: S,
|
|
435
|
+
...h
|
|
436
|
+
} = j(ut), u = oe(), [p, g] = l.useState(o ?? ""), C = l.useMemo(() => S === a().find((M) => M.ref.current === i.current)?.ref.current, [a, S]), v = h.value === e, x = () => {
|
|
437
|
+
t || (h.onValueChange(e), m(p), h.onOpenChange(!1), h.autocomplete === "both" && h.onFilterValueChange(p), h.trigger?.focus({ preventScroll: !0 }));
|
|
438
|
+
}, { startsWith: w } = Me(h.locale, { sensitivity: "base" }), A = l.useCallback((M) => {
|
|
439
|
+
g((P) => P || (M?.textContent ?? "").trim());
|
|
431
440
|
}, []);
|
|
432
|
-
|
|
441
|
+
l.useEffect(() => {
|
|
433
442
|
v && f === void 0 && p !== "" && m(p);
|
|
434
443
|
}, [p, v, f, m]);
|
|
435
444
|
const T = oe();
|
|
436
|
-
return
|
|
445
|
+
return h.autocomplete === "list" && p && f && !w(p, f) || h.autocomplete === "both" && p && h.filterValue && !w(p, h.filterValue) ? null : /* @__PURE__ */ d(Qt, { textId: u, onTextValueChange: A, isSelected: v, children: /* @__PURE__ */ d(pe.ItemSlot, { scope: void 0, value: e, textValue: p, disabled: t, type: "option", children: /* @__PURE__ */ d(
|
|
437
446
|
N.div,
|
|
438
447
|
{
|
|
439
448
|
role: "option",
|
|
@@ -444,45 +453,45 @@ const at = "ComboboxContent", jt = r.forwardRef((n, s) => {
|
|
|
444
453
|
"aria-disabled": t || void 0,
|
|
445
454
|
"data-disabled": t ? "" : void 0,
|
|
446
455
|
tabIndex: t ? void 0 : -1,
|
|
447
|
-
...
|
|
456
|
+
...r,
|
|
448
457
|
id: T,
|
|
449
458
|
ref: c,
|
|
450
|
-
onPointerUp: E(
|
|
459
|
+
onPointerUp: E(r.onPointerUp, x)
|
|
451
460
|
}
|
|
452
461
|
) }) });
|
|
453
|
-
}), eo = "ComboboxItemText", to =
|
|
454
|
-
const { className: e, style: t, ...o } = n,
|
|
455
|
-
return /* @__PURE__ */ d(N.span, { id:
|
|
456
|
-
}), oo = "ComboboxItemIndicator", no =
|
|
462
|
+
}), eo = "ComboboxItemText", to = l.forwardRef((n, s) => {
|
|
463
|
+
const { className: e, style: t, ...o } = n, r = dt(eo), i = _(s, r.onTextValueChange);
|
|
464
|
+
return /* @__PURE__ */ d(N.span, { id: r.textId, ...o, ref: i });
|
|
465
|
+
}), oo = "ComboboxItemIndicator", no = l.forwardRef((n, s) => {
|
|
457
466
|
const { isSelected: e } = dt(oo);
|
|
458
467
|
return e ? /* @__PURE__ */ d(N.span, { "aria-hidden": !0, ...n, ref: s }) : null;
|
|
459
|
-
}), pt = "ComboboxNoValueFound", ro =
|
|
460
|
-
const { textValue: e = "", locale: t } =
|
|
461
|
-
return
|
|
468
|
+
}), pt = "ComboboxNoValueFound", ro = l.forwardRef((n, s) => {
|
|
469
|
+
const { textValue: e = "", locale: t } = j(pt), [o, r] = l.useState([]), { subscribe: i } = me(void 0), { startsWith: c } = Me(t, { sensitivity: "base" });
|
|
470
|
+
return l.useEffect(() => {
|
|
462
471
|
const a = i((m) => {
|
|
463
|
-
|
|
472
|
+
r(m);
|
|
464
473
|
});
|
|
465
474
|
return () => {
|
|
466
475
|
a();
|
|
467
476
|
};
|
|
468
477
|
}, [i]), o.some((a) => c(a.textValue, e)) ? null : /* @__PURE__ */ d(N.div, { ...n, ref: s });
|
|
469
|
-
}), lo =
|
|
470
|
-
const { disabled: e = !1, ...t } = n, o =
|
|
471
|
-
!e &&
|
|
478
|
+
}), lo = l.forwardRef((n, s) => {
|
|
479
|
+
const { disabled: e = !1, ...t } = n, o = j(pt), { textValue: r, visuallyFocussedItem: i } = o, { getItems: c, subscribe: a } = me(void 0), m = l.useRef(null), [f, S] = l.useState(!1), h = _(s, m), u = l.useMemo(() => i === c().find((C) => C.ref.current === m.current)?.ref.current, [c, i]), p = oe(), g = () => {
|
|
480
|
+
!e && r && (o.onValueChange(r), o.onTextValueChange(r), o.onOpenChange(!1), o.autocomplete === "both" && o.onFilterValueChange(r), o.trigger?.focus({ preventScroll: !0 }));
|
|
472
481
|
};
|
|
473
|
-
return
|
|
482
|
+
return B(() => {
|
|
474
483
|
const C = a((v) => {
|
|
475
|
-
|
|
484
|
+
S(!v.some((x) => x.textValue === r && x.type !== "create"));
|
|
476
485
|
});
|
|
477
486
|
return () => {
|
|
478
487
|
C();
|
|
479
488
|
};
|
|
480
|
-
}, [
|
|
489
|
+
}, [r, a]), !r || !f ? null : /* @__PURE__ */ d(
|
|
481
490
|
pe.ItemSlot,
|
|
482
491
|
{
|
|
483
492
|
scope: void 0,
|
|
484
|
-
value:
|
|
485
|
-
textValue:
|
|
493
|
+
value: r ?? "",
|
|
494
|
+
textValue: r ?? "",
|
|
486
495
|
disabled: e,
|
|
487
496
|
type: "create",
|
|
488
497
|
children: /* @__PURE__ */ d(
|
|
@@ -495,8 +504,8 @@ const at = "ComboboxContent", jt = r.forwardRef((n, s) => {
|
|
|
495
504
|
"data-highlighted": u ? "" : void 0,
|
|
496
505
|
...t,
|
|
497
506
|
id: p,
|
|
498
|
-
ref:
|
|
499
|
-
onPointerUp: E(t.onPointerUp,
|
|
507
|
+
ref: h,
|
|
508
|
+
onPointerUp: E(t.onPointerUp, g)
|
|
500
509
|
}
|
|
501
510
|
)
|
|
502
511
|
}
|
|
@@ -527,13 +536,13 @@ const Tn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
|
527
536
|
}, Symbol.toStringTag, { value: "Module" })), So = [" ", "Enter", "ArrowUp", "ArrowDown"], bo = [" ", "Enter"], he = "Select", [Ce, ge, wo] = Pt(he), [ae, yo] = Qe(he, [
|
|
528
537
|
wo,
|
|
529
538
|
ot
|
|
530
|
-
]), ve = ot(), [Io,
|
|
539
|
+
]), ve = ot(), [Io, Y] = ae(he), [To, Eo] = ae(he), Oe = (n) => {
|
|
531
540
|
const {
|
|
532
541
|
__scopeSelect: s,
|
|
533
542
|
children: e,
|
|
534
543
|
open: t,
|
|
535
544
|
defaultOpen: o,
|
|
536
|
-
onOpenChange:
|
|
545
|
+
onOpenChange: r,
|
|
537
546
|
value: i,
|
|
538
547
|
defaultValue: c,
|
|
539
548
|
onValueChange: a,
|
|
@@ -541,29 +550,29 @@ const Tn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
|
541
550
|
// name,
|
|
542
551
|
// autoComplete,
|
|
543
552
|
disabled: f,
|
|
544
|
-
required:
|
|
545
|
-
multi:
|
|
546
|
-
} = n, u = ve(s), [p,
|
|
553
|
+
required: S,
|
|
554
|
+
multi: h = !1
|
|
555
|
+
} = n, u = ve(s), [p, g] = l.useState(null), [C, v] = l.useState(null), [x, w] = l.useState(!1), A = Vt(m), [T = !1, M] = ie({
|
|
547
556
|
prop: t,
|
|
548
557
|
defaultProp: o,
|
|
549
|
-
onChange:
|
|
558
|
+
onChange: r
|
|
550
559
|
}), [P, k] = ie({
|
|
551
560
|
prop: i,
|
|
552
561
|
defaultProp: c,
|
|
553
562
|
onChange(O) {
|
|
554
563
|
a && (Array.isArray(O), a(O));
|
|
555
564
|
}
|
|
556
|
-
}),
|
|
565
|
+
}), H = l.useRef(null), [z, $] = l.useState(/* @__PURE__ */ new Set());
|
|
557
566
|
return /* @__PURE__ */ d(re.Root, { ...u, children: /* @__PURE__ */ d(
|
|
558
567
|
Io,
|
|
559
568
|
{
|
|
560
|
-
required:
|
|
569
|
+
required: S,
|
|
561
570
|
scope: s,
|
|
562
571
|
trigger: p,
|
|
563
|
-
onTriggerChange:
|
|
572
|
+
onTriggerChange: g,
|
|
564
573
|
valueNode: C,
|
|
565
574
|
onValueNodeChange: v,
|
|
566
|
-
valueNodeHasChildren:
|
|
575
|
+
valueNodeHasChildren: x,
|
|
567
576
|
onValueNodeHasChildrenChange: w,
|
|
568
577
|
contentId: oe(),
|
|
569
578
|
value: P,
|
|
@@ -571,20 +580,20 @@ const Tn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
|
571
580
|
open: T,
|
|
572
581
|
onOpenChange: M,
|
|
573
582
|
dir: A,
|
|
574
|
-
triggerPointerDownPosRef:
|
|
583
|
+
triggerPointerDownPosRef: H,
|
|
575
584
|
disabled: f,
|
|
576
|
-
multi:
|
|
585
|
+
multi: h,
|
|
577
586
|
children: /* @__PURE__ */ d(Ce.Provider, { scope: s, children: /* @__PURE__ */ d(
|
|
578
587
|
To,
|
|
579
588
|
{
|
|
580
589
|
scope: n.__scopeSelect,
|
|
581
|
-
onNativeOptionAdd:
|
|
582
|
-
|
|
590
|
+
onNativeOptionAdd: l.useCallback((O) => {
|
|
591
|
+
$((F) => new Set(F).add(O));
|
|
583
592
|
}, []),
|
|
584
|
-
onNativeOptionRemove:
|
|
585
|
-
|
|
586
|
-
const
|
|
587
|
-
return
|
|
593
|
+
onNativeOptionRemove: l.useCallback((O) => {
|
|
594
|
+
$((F) => {
|
|
595
|
+
const L = new Set(F);
|
|
596
|
+
return L.delete(O), L;
|
|
588
597
|
});
|
|
589
598
|
}, []),
|
|
590
599
|
children: e
|
|
@@ -594,29 +603,29 @@ const Tn = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
|
594
603
|
) });
|
|
595
604
|
};
|
|
596
605
|
Oe.displayName = he;
|
|
597
|
-
const mt = "SelectTrigger", De =
|
|
606
|
+
const mt = "SelectTrigger", De = l.forwardRef(
|
|
598
607
|
(n, s) => {
|
|
599
|
-
const { __scopeSelect: e, ...t } = n, o = ve(e),
|
|
600
|
-
const p = a().filter((v) => !v.disabled),
|
|
608
|
+
const { __scopeSelect: e, ...t } = n, o = ve(e), r = Y(mt, e), i = r.disabled, c = _(s, r.onTriggerChange), a = ge(e), [m, f, S] = It((u) => {
|
|
609
|
+
const p = a().filter((v) => !v.disabled), g = p.find((v) => v.value === r.value), C = Tt(p, u, g);
|
|
601
610
|
if (C !== void 0 && !Array.isArray(C.value)) {
|
|
602
|
-
const v =
|
|
603
|
-
|
|
611
|
+
const v = r.multi ? [C.value] : C.value;
|
|
612
|
+
r.onValueChange(v);
|
|
604
613
|
}
|
|
605
|
-
}),
|
|
606
|
-
i || (
|
|
614
|
+
}), h = () => {
|
|
615
|
+
i || (r.onOpenChange(!0), S());
|
|
607
616
|
};
|
|
608
617
|
return /* @__PURE__ */ d(re.Anchor, { asChild: !0, ...o, children: /* @__PURE__ */ d(
|
|
609
618
|
N.div,
|
|
610
619
|
{
|
|
611
620
|
role: "combobox",
|
|
612
|
-
"aria-controls":
|
|
613
|
-
"aria-expanded":
|
|
614
|
-
"aria-required":
|
|
621
|
+
"aria-controls": r.contentId,
|
|
622
|
+
"aria-expanded": r.open,
|
|
623
|
+
"aria-required": r.required,
|
|
615
624
|
"aria-autocomplete": "none",
|
|
616
|
-
dir:
|
|
617
|
-
"data-state":
|
|
625
|
+
dir: r.dir,
|
|
626
|
+
"data-state": r.open ? "open" : "closed",
|
|
618
627
|
"data-disabled": i ? "" : void 0,
|
|
619
|
-
"data-placeholder":
|
|
628
|
+
"data-placeholder": r.value === void 0 ? "" : void 0,
|
|
620
629
|
tabIndex: i ? void 0 : 0,
|
|
621
630
|
...t,
|
|
622
631
|
ref: c,
|
|
@@ -625,88 +634,88 @@ const mt = "SelectTrigger", De = r.forwardRef(
|
|
|
625
634
|
}),
|
|
626
635
|
onPointerDown: E(t.onPointerDown, (u) => {
|
|
627
636
|
const p = u.target;
|
|
628
|
-
p.hasPointerCapture(u.pointerId) && p.releasePointerCapture(u.pointerId), (p.closest("button") ?? p.closest("div")) === u.currentTarget && u.button === 0 && u.ctrlKey === !1 && (
|
|
637
|
+
p.hasPointerCapture(u.pointerId) && p.releasePointerCapture(u.pointerId), (p.closest("button") ?? p.closest("div")) === u.currentTarget && u.button === 0 && u.ctrlKey === !1 && (h(), r.triggerPointerDownPosRef.current = {
|
|
629
638
|
x: Math.round(u.pageX),
|
|
630
639
|
y: Math.round(u.pageY)
|
|
631
640
|
}, u.preventDefault());
|
|
632
641
|
}),
|
|
633
642
|
onKeyDown: E(t.onKeyDown, (u) => {
|
|
634
|
-
const p = m.current !== "",
|
|
635
|
-
(C.closest("button") ?? C.closest("div")) === u.currentTarget && (!
|
|
643
|
+
const p = m.current !== "", g = u.ctrlKey || u.altKey || u.metaKey, C = u.target;
|
|
644
|
+
(C.closest("button") ?? C.closest("div")) === u.currentTarget && (!g && u.key.length === 1 && f(u.key), !(p && u.key === " ") && So.includes(u.key) && (h(), u.preventDefault()));
|
|
636
645
|
})
|
|
637
646
|
}
|
|
638
647
|
) });
|
|
639
648
|
}
|
|
640
649
|
);
|
|
641
650
|
De.displayName = mt;
|
|
642
|
-
const ht = "SelectValue", ke =
|
|
651
|
+
const ht = "SelectValue", ke = l.forwardRef(
|
|
643
652
|
(n, s) => {
|
|
644
|
-
const { __scopeSelect: e, children: t, placeholder: o, ...
|
|
645
|
-
|
|
653
|
+
const { __scopeSelect: e, children: t, placeholder: o, ...r } = n, i = Y(ht, e), { onValueNodeHasChildrenChange: c } = i, a = t !== void 0, m = _(s, i.onValueNodeChange), [f, S] = l.useState([]), h = ge(e);
|
|
654
|
+
B(() => {
|
|
646
655
|
c(a);
|
|
647
|
-
}, [c, a]),
|
|
656
|
+
}, [c, a]), l.useLayoutEffect(() => {
|
|
648
657
|
if (Array.isArray(i.value) && f.length !== i.value.length) {
|
|
649
658
|
const p = setTimeout(() => {
|
|
650
|
-
const
|
|
659
|
+
const g = h().filter(
|
|
651
660
|
(C) => Array.isArray(C.value) ? !1 : i.value?.includes(C.value)
|
|
652
661
|
);
|
|
653
|
-
|
|
662
|
+
S(g);
|
|
654
663
|
});
|
|
655
664
|
return () => {
|
|
656
665
|
clearTimeout(p);
|
|
657
666
|
};
|
|
658
667
|
}
|
|
659
|
-
}, [i.value,
|
|
668
|
+
}, [i.value, h, f]);
|
|
660
669
|
let u;
|
|
661
670
|
if ((i.value === void 0 || i.value.length === 0) && o !== void 0)
|
|
662
671
|
u = /* @__PURE__ */ d("span", { children: o });
|
|
663
672
|
else if (typeof t == "function")
|
|
664
673
|
if (Array.isArray(i.value)) {
|
|
665
|
-
const p = i.value.map((
|
|
666
|
-
const C = f.find((v) => v.value ===
|
|
667
|
-
return C ? t({ value:
|
|
674
|
+
const p = i.value.map((g) => {
|
|
675
|
+
const C = f.find((v) => v.value === g);
|
|
676
|
+
return C ? t({ value: g, textValue: C?.textValue }) : null;
|
|
668
677
|
});
|
|
669
|
-
u = p.every((
|
|
678
|
+
u = p.every((g) => g === null) ? o : p;
|
|
670
679
|
} else
|
|
671
680
|
u = t(i.value);
|
|
672
681
|
else
|
|
673
682
|
u = t;
|
|
674
|
-
return /* @__PURE__ */ d(N.span, { ...
|
|
683
|
+
return /* @__PURE__ */ d(N.span, { ...r, ref: m, children: u || null });
|
|
675
684
|
}
|
|
676
685
|
);
|
|
677
686
|
ke.displayName = ht;
|
|
678
|
-
const Po = "SelectIcon",
|
|
687
|
+
const Po = "SelectIcon", Fe = l.forwardRef(
|
|
679
688
|
(n, s) => {
|
|
680
689
|
const { __scopeSelect: e, children: t, ...o } = n;
|
|
681
690
|
return /* @__PURE__ */ d(N.span, { "aria-hidden": !0, ...o, ref: s, children: t || "▼" });
|
|
682
691
|
}
|
|
683
692
|
);
|
|
684
|
-
|
|
685
|
-
const Vo = "SelectPortal",
|
|
686
|
-
|
|
687
|
-
const ne = "SelectContent", Be =
|
|
693
|
+
Fe.displayName = Po;
|
|
694
|
+
const Vo = "SelectPortal", Le = (n) => /* @__PURE__ */ d(nt, { asChild: !0, ...n });
|
|
695
|
+
Le.displayName = Vo;
|
|
696
|
+
const ne = "SelectContent", Be = l.forwardRef(
|
|
688
697
|
(n, s) => {
|
|
689
|
-
const e =
|
|
690
|
-
if (
|
|
698
|
+
const e = Y(ne, n.__scopeSelect), [t, o] = l.useState();
|
|
699
|
+
if (B(() => {
|
|
691
700
|
o(new DocumentFragment());
|
|
692
701
|
}, []), !e.open) {
|
|
693
|
-
const
|
|
694
|
-
return
|
|
702
|
+
const r = t;
|
|
703
|
+
return r ? _e.createPortal(
|
|
695
704
|
/* @__PURE__ */ d(gt, { scope: n.__scopeSelect, children: /* @__PURE__ */ d(Ce.Slot, { scope: n.__scopeSelect, children: /* @__PURE__ */ d("div", { children: n.children }) }) }),
|
|
696
|
-
|
|
705
|
+
r
|
|
697
706
|
) : null;
|
|
698
707
|
}
|
|
699
708
|
return /* @__PURE__ */ d(xt, { ...n, ref: s });
|
|
700
709
|
}
|
|
701
710
|
);
|
|
702
711
|
Be.displayName = ne;
|
|
703
|
-
const
|
|
712
|
+
const G = 10, [gt, J] = ae(ne), Ro = "SelectContentImpl", xt = l.forwardRef(
|
|
704
713
|
(n, s) => {
|
|
705
714
|
const {
|
|
706
715
|
__scopeSelect: e,
|
|
707
716
|
position: t = "item-aligned",
|
|
708
717
|
onCloseAutoFocus: o,
|
|
709
|
-
onEscapeKeyDown:
|
|
718
|
+
onEscapeKeyDown: r,
|
|
710
719
|
onPointerDownOutside: i,
|
|
711
720
|
//
|
|
712
721
|
// PopperContent props
|
|
@@ -714,81 +723,81 @@ const z = 10, [gt, J] = ae(ne), Ro = "SelectContentImpl", xt = r.forwardRef(
|
|
|
714
723
|
sideOffset: a,
|
|
715
724
|
align: m,
|
|
716
725
|
alignOffset: f,
|
|
717
|
-
arrowPadding:
|
|
718
|
-
collisionBoundary:
|
|
726
|
+
arrowPadding: S,
|
|
727
|
+
collisionBoundary: h,
|
|
719
728
|
collisionPadding: u,
|
|
720
729
|
sticky: p,
|
|
721
|
-
hideWhenDetached:
|
|
730
|
+
hideWhenDetached: g,
|
|
722
731
|
avoidCollisions: C,
|
|
723
732
|
//
|
|
724
733
|
...v
|
|
725
|
-
} = n,
|
|
726
|
-
|
|
734
|
+
} = n, x = Y(ne, e), [w, A] = l.useState(null), [T, M] = l.useState(null), P = _(s, (b) => A(b)), [k, H] = l.useState(null), [z, $] = l.useState(null), O = ge(e), [F, L] = l.useState(!1), U = l.useRef(!1);
|
|
735
|
+
l.useEffect(() => {
|
|
727
736
|
if (w)
|
|
728
737
|
return rt(w);
|
|
729
738
|
}, [w]), Rt();
|
|
730
|
-
const
|
|
731
|
-
(
|
|
739
|
+
const K = l.useCallback(
|
|
740
|
+
(b) => {
|
|
732
741
|
const [y, ...D] = O().map((R) => R.ref.current), [I] = D.slice(-1), V = document.activeElement;
|
|
733
|
-
for (const R of
|
|
742
|
+
for (const R of b)
|
|
734
743
|
if (R === V || (R?.scrollIntoView({ block: "nearest" }), R === y && T && (T.scrollTop = 0), R === I && T && (T.scrollTop = T.scrollHeight), R?.focus(), document.activeElement !== V))
|
|
735
744
|
return;
|
|
736
745
|
},
|
|
737
746
|
[O, T]
|
|
738
|
-
),
|
|
739
|
-
() =>
|
|
740
|
-
[
|
|
747
|
+
), q = l.useCallback(
|
|
748
|
+
() => K([k, w]),
|
|
749
|
+
[K, k, w]
|
|
741
750
|
);
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
}, [
|
|
745
|
-
const { onOpenChange:
|
|
746
|
-
|
|
751
|
+
l.useEffect(() => {
|
|
752
|
+
F && q();
|
|
753
|
+
}, [F, q]);
|
|
754
|
+
const { onOpenChange: X, triggerPointerDownPosRef: W } = x;
|
|
755
|
+
l.useEffect(() => {
|
|
747
756
|
if (w) {
|
|
748
|
-
let
|
|
757
|
+
let b = { x: 0, y: 0 };
|
|
749
758
|
const y = (I) => {
|
|
750
|
-
|
|
751
|
-
x: Math.abs(Math.round(I.pageX) - (
|
|
752
|
-
y: Math.abs(Math.round(I.pageY) - (
|
|
759
|
+
b = {
|
|
760
|
+
x: Math.abs(Math.round(I.pageX) - (W.current?.x ?? 0)),
|
|
761
|
+
y: Math.abs(Math.round(I.pageY) - (W.current?.y ?? 0))
|
|
753
762
|
};
|
|
754
763
|
}, D = (I) => {
|
|
755
|
-
|
|
764
|
+
b.x <= 10 && b.y <= 10 ? I.preventDefault() : w.contains(I.target) || X(!1), document.removeEventListener("pointermove", y), W.current = null;
|
|
756
765
|
};
|
|
757
|
-
return
|
|
766
|
+
return W.current !== null && (document.addEventListener("pointermove", y), document.addEventListener("pointerup", D, { capture: !0, once: !0 })), () => {
|
|
758
767
|
document.removeEventListener("pointermove", y), document.removeEventListener("pointerup", D, { capture: !0 });
|
|
759
768
|
};
|
|
760
769
|
}
|
|
761
|
-
}, [w,
|
|
762
|
-
const
|
|
763
|
-
return window.addEventListener("blur",
|
|
764
|
-
window.removeEventListener("blur",
|
|
770
|
+
}, [w, X, W]), l.useEffect(() => {
|
|
771
|
+
const b = () => X(!1);
|
|
772
|
+
return window.addEventListener("blur", b), window.addEventListener("resize", b), () => {
|
|
773
|
+
window.removeEventListener("blur", b), window.removeEventListener("resize", b);
|
|
765
774
|
};
|
|
766
|
-
}, [
|
|
767
|
-
const [ue, le] = It((
|
|
768
|
-
const y = O().filter((V) => !V.disabled), D = y.find((V) => V.ref.current === document.activeElement), I = Tt(y,
|
|
775
|
+
}, [X]);
|
|
776
|
+
const [ue, le] = It((b) => {
|
|
777
|
+
const y = O().filter((V) => !V.disabled), D = y.find((V) => V.ref.current === document.activeElement), I = Tt(y, b, D);
|
|
769
778
|
I && setTimeout(() => I.ref.current.focus());
|
|
770
|
-
}), se =
|
|
771
|
-
(
|
|
772
|
-
const I =
|
|
773
|
-
(
|
|
779
|
+
}), se = l.useCallback(
|
|
780
|
+
(b, y, D) => {
|
|
781
|
+
const I = !U.current && !D;
|
|
782
|
+
(x.value !== void 0 && x.value === y || I) && (H(b), I && (U.current = !0));
|
|
774
783
|
},
|
|
775
|
-
[
|
|
776
|
-
), de =
|
|
777
|
-
(
|
|
778
|
-
const I =
|
|
779
|
-
(
|
|
784
|
+
[x.value]
|
|
785
|
+
), de = l.useCallback(() => w?.focus(), [w]), Z = l.useCallback(
|
|
786
|
+
(b, y, D) => {
|
|
787
|
+
const I = !U.current && !D;
|
|
788
|
+
(x.value !== void 0 && (Array.isArray(y) ? y.every((R) => x.value?.includes(R)) : x.value === y) || I) && $(b);
|
|
780
789
|
},
|
|
781
|
-
[
|
|
790
|
+
[x.value]
|
|
782
791
|
), ce = t === "popper" ? Te : Ct, Q = ce === Te ? {
|
|
783
792
|
side: c,
|
|
784
793
|
sideOffset: a,
|
|
785
794
|
align: m,
|
|
786
795
|
alignOffset: f,
|
|
787
|
-
arrowPadding:
|
|
788
|
-
collisionBoundary:
|
|
796
|
+
arrowPadding: S,
|
|
797
|
+
collisionBoundary: h,
|
|
789
798
|
collisionPadding: u,
|
|
790
799
|
sticky: p,
|
|
791
|
-
hideWhenDetached:
|
|
800
|
+
hideWhenDetached: g,
|
|
792
801
|
avoidCollisions: C
|
|
793
802
|
} : {};
|
|
794
803
|
return /* @__PURE__ */ d(
|
|
@@ -801,44 +810,44 @@ const z = 10, [gt, J] = ae(ne), Ro = "SelectContentImpl", xt = r.forwardRef(
|
|
|
801
810
|
itemRefCallback: se,
|
|
802
811
|
selectedItem: k,
|
|
803
812
|
onItemLeave: de,
|
|
804
|
-
itemTextRefCallback:
|
|
805
|
-
focusSelectedItem:
|
|
806
|
-
selectedItemText:
|
|
813
|
+
itemTextRefCallback: Z,
|
|
814
|
+
focusSelectedItem: q,
|
|
815
|
+
selectedItemText: z,
|
|
807
816
|
position: t,
|
|
808
|
-
isPositioned:
|
|
817
|
+
isPositioned: F,
|
|
809
818
|
searchRef: ue,
|
|
810
819
|
children: /* @__PURE__ */ d(lt, { as: Ie, allowPinchZoom: !0, children: /* @__PURE__ */ d(
|
|
811
820
|
Nt,
|
|
812
821
|
{
|
|
813
822
|
asChild: !0,
|
|
814
|
-
trapped:
|
|
815
|
-
onMountAutoFocus: (
|
|
816
|
-
|
|
823
|
+
trapped: x.open,
|
|
824
|
+
onMountAutoFocus: (b) => {
|
|
825
|
+
b.preventDefault();
|
|
817
826
|
},
|
|
818
|
-
onUnmountAutoFocus: E(o, (
|
|
819
|
-
|
|
827
|
+
onUnmountAutoFocus: E(o, (b) => {
|
|
828
|
+
x.trigger?.focus({ preventScroll: !0 }), document.getSelection()?.empty(), b.preventDefault();
|
|
820
829
|
}),
|
|
821
830
|
children: /* @__PURE__ */ d(
|
|
822
831
|
tt,
|
|
823
832
|
{
|
|
824
833
|
asChild: !0,
|
|
825
834
|
disableOutsidePointerEvents: !0,
|
|
826
|
-
onEscapeKeyDown:
|
|
835
|
+
onEscapeKeyDown: r,
|
|
827
836
|
onPointerDownOutside: i,
|
|
828
|
-
onFocusOutside: (
|
|
829
|
-
onDismiss: () =>
|
|
837
|
+
onFocusOutside: (b) => b.preventDefault(),
|
|
838
|
+
onDismiss: () => x.onOpenChange(!1),
|
|
830
839
|
children: /* @__PURE__ */ d(
|
|
831
840
|
ce,
|
|
832
841
|
{
|
|
833
842
|
role: "listbox",
|
|
834
|
-
id:
|
|
835
|
-
"data-state":
|
|
836
|
-
"aria-multiselectable":
|
|
837
|
-
dir:
|
|
838
|
-
onContextMenu: (
|
|
843
|
+
id: x.contentId,
|
|
844
|
+
"data-state": x.open ? "open" : "closed",
|
|
845
|
+
"aria-multiselectable": x.multi ? "true" : void 0,
|
|
846
|
+
dir: x.dir,
|
|
847
|
+
onContextMenu: (b) => b.preventDefault(),
|
|
839
848
|
...v,
|
|
840
849
|
...Q,
|
|
841
|
-
onPlaced: () =>
|
|
850
|
+
onPlaced: () => L(!0),
|
|
842
851
|
ref: P,
|
|
843
852
|
style: {
|
|
844
853
|
// flex layout so we can place the scroll buttons properly
|
|
@@ -848,15 +857,15 @@ const z = 10, [gt, J] = ae(ne), Ro = "SelectContentImpl", xt = r.forwardRef(
|
|
|
848
857
|
outline: "none",
|
|
849
858
|
...v.style
|
|
850
859
|
},
|
|
851
|
-
onKeyDown: E(v.onKeyDown, (
|
|
852
|
-
const y =
|
|
853
|
-
if (
|
|
860
|
+
onKeyDown: E(v.onKeyDown, (b) => {
|
|
861
|
+
const y = b.ctrlKey || b.altKey || b.metaKey;
|
|
862
|
+
if (b.key === "Tab" && b.preventDefault(), !y && b.key.length === 1 && le(b.key), ["ArrowUp", "ArrowDown", "Home", "End"].includes(b.key)) {
|
|
854
863
|
let I = O().filter((V) => !V.disabled).map((V) => V.ref.current);
|
|
855
|
-
if (["ArrowUp", "End"].includes(
|
|
856
|
-
const V =
|
|
864
|
+
if (["ArrowUp", "End"].includes(b.key) && (I = I.slice().reverse()), ["ArrowUp", "ArrowDown"].includes(b.key)) {
|
|
865
|
+
const V = b.target, R = I.indexOf(V);
|
|
857
866
|
I = I.slice(R + 1);
|
|
858
867
|
}
|
|
859
|
-
setTimeout(() =>
|
|
868
|
+
setTimeout(() => K(I)), b.preventDefault();
|
|
860
869
|
}
|
|
861
870
|
})
|
|
862
871
|
}
|
|
@@ -870,62 +879,62 @@ const z = 10, [gt, J] = ae(ne), Ro = "SelectContentImpl", xt = r.forwardRef(
|
|
|
870
879
|
}
|
|
871
880
|
);
|
|
872
881
|
xt.displayName = Ro;
|
|
873
|
-
const No = "SelectItemAlignedPosition", Ct =
|
|
882
|
+
const No = "SelectItemAlignedPosition", Ct = l.forwardRef(
|
|
874
883
|
(n, s) => {
|
|
875
|
-
const { __scopeSelect: e, onPlaced: t, ...o } = n,
|
|
876
|
-
if (
|
|
877
|
-
const P =
|
|
878
|
-
if (
|
|
879
|
-
const V =
|
|
884
|
+
const { __scopeSelect: e, onPlaced: t, ...o } = n, r = Y(ne, e), i = J(ne, e), [c, a] = l.useState(null), [m, f] = l.useState(null), S = _(s, (P) => f(P)), h = ge(e), u = l.useRef(!1), p = l.useRef(!0), { viewport: g, selectedItem: C, selectedItemText: v, focusSelectedItem: x } = i, w = l.useCallback(() => {
|
|
885
|
+
if (r.trigger && r.valueNode && c && m && g && C && v) {
|
|
886
|
+
const P = r.trigger.getBoundingClientRect(), k = m.getBoundingClientRect(), H = r.valueNode.getBoundingClientRect(), z = v.getBoundingClientRect();
|
|
887
|
+
if (r.dir !== "rtl") {
|
|
888
|
+
const V = z.left - k.left, R = H.left - V, ee = P.left - R, te = P.width + ee, Se = Math.max(te, k.width), be = window.innerWidth - G, we = Ze(R, [G, be - Se]);
|
|
880
889
|
c.style.minWidth = `${te}px`, c.style.left = `${we}px`;
|
|
881
890
|
} else {
|
|
882
|
-
const V = k.right -
|
|
891
|
+
const V = k.right - z.right, R = window.innerWidth - H.right - V, ee = window.innerWidth - P.right - R, te = P.width + ee, Se = Math.max(te, k.width), be = window.innerWidth - G, we = Ze(R, [G, be - Se]);
|
|
883
892
|
c.style.minWidth = `${te}px`, c.style.right = `${we}px`;
|
|
884
893
|
}
|
|
885
|
-
const
|
|
886
|
-
if (y <=
|
|
887
|
-
const V = C ===
|
|
894
|
+
const $ = h(), O = window.innerHeight - G * 2, F = g.scrollHeight, L = window.getComputedStyle(m), U = parseInt(L.borderTopWidth, 10), K = parseInt(L.paddingTop, 10), q = parseInt(L.borderBottomWidth, 10), X = parseInt(L.paddingBottom, 10), W = U + K + F + X + q, ue = Math.min(C.offsetHeight * 5, W), le = window.getComputedStyle(g), se = parseInt(le.paddingTop, 10), de = parseInt(le.paddingBottom, 10), Z = P.top + P.height / 2 - G, ce = O - Z, Q = C.offsetHeight / 2, b = C.offsetTop + Q, y = U + K + b, D = W - y;
|
|
895
|
+
if (y <= Z) {
|
|
896
|
+
const V = C === $[$.length - 1].ref.current;
|
|
888
897
|
c.style.bottom = "0px";
|
|
889
|
-
const R = m.clientHeight -
|
|
898
|
+
const R = m.clientHeight - g.offsetTop - g.offsetHeight, ee = Math.max(
|
|
890
899
|
ce,
|
|
891
900
|
Q + // viewport might have padding bottom, include it to avoid a scrollable viewport
|
|
892
|
-
(V ? de : 0) + R +
|
|
901
|
+
(V ? de : 0) + R + q
|
|
893
902
|
), te = y + ee;
|
|
894
903
|
c.style.height = `${te}px`;
|
|
895
904
|
} else {
|
|
896
|
-
const V = C ===
|
|
905
|
+
const V = C === $[0].ref.current;
|
|
897
906
|
c.style.top = "0px";
|
|
898
907
|
const ee = Math.max(
|
|
899
|
-
|
|
900
|
-
|
|
908
|
+
Z,
|
|
909
|
+
U + g.offsetTop + // viewport might have padding top, include it to avoid a scrollable viewport
|
|
901
910
|
(V ? se : 0) + Q
|
|
902
911
|
) + D;
|
|
903
|
-
c.style.height = `${ee}px`,
|
|
912
|
+
c.style.height = `${ee}px`, g.scrollTop = y - Z + g.offsetTop;
|
|
904
913
|
}
|
|
905
|
-
c.style.margin = `${
|
|
914
|
+
c.style.margin = `${G}px 0`, c.style.minHeight = `${ue}px`, c.style.maxHeight = `${O}px`, t?.(), requestAnimationFrame(() => u.current = !0);
|
|
906
915
|
}
|
|
907
916
|
}, [
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
917
|
+
h,
|
|
918
|
+
r.trigger,
|
|
919
|
+
r.valueNode,
|
|
911
920
|
c,
|
|
912
921
|
m,
|
|
913
|
-
|
|
922
|
+
g,
|
|
914
923
|
C,
|
|
915
924
|
v,
|
|
916
|
-
|
|
925
|
+
r.dir,
|
|
917
926
|
t
|
|
918
927
|
]);
|
|
919
|
-
|
|
920
|
-
const [A, T] =
|
|
921
|
-
|
|
928
|
+
B(() => w(), [w]);
|
|
929
|
+
const [A, T] = l.useState();
|
|
930
|
+
B(() => {
|
|
922
931
|
m && T(window.getComputedStyle(m).zIndex);
|
|
923
932
|
}, [m]);
|
|
924
|
-
const M =
|
|
933
|
+
const M = l.useCallback(
|
|
925
934
|
(P) => {
|
|
926
|
-
P && p.current === !0 && (w(),
|
|
935
|
+
P && p.current === !0 && (w(), x?.(), p.current = !1);
|
|
927
936
|
},
|
|
928
|
-
[w,
|
|
937
|
+
[w, x]
|
|
929
938
|
);
|
|
930
939
|
return /* @__PURE__ */ d(
|
|
931
940
|
_o,
|
|
@@ -948,7 +957,7 @@ const No = "SelectItemAlignedPosition", Ct = r.forwardRef(
|
|
|
948
957
|
N.div,
|
|
949
958
|
{
|
|
950
959
|
...o,
|
|
951
|
-
ref:
|
|
960
|
+
ref: S,
|
|
952
961
|
style: {
|
|
953
962
|
// When we get the height of the content, it includes borders. If we were to set
|
|
954
963
|
// the height without having `boxSizing: 'border-box'` it would be too big.
|
|
@@ -966,21 +975,21 @@ const No = "SelectItemAlignedPosition", Ct = r.forwardRef(
|
|
|
966
975
|
}
|
|
967
976
|
);
|
|
968
977
|
Ct.displayName = No;
|
|
969
|
-
const Ao = "SelectPopperPosition", Te =
|
|
978
|
+
const Ao = "SelectPopperPosition", Te = l.forwardRef(
|
|
970
979
|
(n, s) => {
|
|
971
|
-
const { __scopeSelect: e, align: t = "start", collisionPadding: o =
|
|
980
|
+
const { __scopeSelect: e, align: t = "start", collisionPadding: o = G, ...r } = n, i = ve(e);
|
|
972
981
|
return /* @__PURE__ */ d(
|
|
973
982
|
re.Content,
|
|
974
983
|
{
|
|
975
984
|
...i,
|
|
976
|
-
...
|
|
985
|
+
...r,
|
|
977
986
|
ref: s,
|
|
978
987
|
align: t,
|
|
979
988
|
collisionPadding: o,
|
|
980
989
|
style: {
|
|
981
990
|
// Ensure border-box for floating-ui calculations
|
|
982
991
|
boxSizing: "border-box",
|
|
983
|
-
...
|
|
992
|
+
...r.style,
|
|
984
993
|
"--radix-select-content-transform-origin": "var(--radix-popper-transform-origin)",
|
|
985
994
|
"--radix-select-content-available-width": "var(--radix-popper-available-width)",
|
|
986
995
|
"--radix-select-content-available-height": "var(--radix-popper-available-height)",
|
|
@@ -995,9 +1004,9 @@ Te.displayName = Ao;
|
|
|
995
1004
|
const [_o, He] = ae(
|
|
996
1005
|
ne,
|
|
997
1006
|
{}
|
|
998
|
-
), Ee = "SelectViewport", $e =
|
|
1007
|
+
), Ee = "SelectViewport", $e = l.forwardRef(
|
|
999
1008
|
(n, s) => {
|
|
1000
|
-
const { __scopeSelect: e, ...t } = n, o = J(Ee, e),
|
|
1009
|
+
const { __scopeSelect: e, ...t } = n, o = J(Ee, e), r = He(Ee, e), i = _(s, o.onViewportChange), c = l.useRef(0);
|
|
1001
1010
|
return /* @__PURE__ */ Ne(Ae, { children: [
|
|
1002
1011
|
/* @__PURE__ */ d(
|
|
1003
1012
|
"style",
|
|
@@ -1024,14 +1033,14 @@ const [_o, He] = ae(
|
|
|
1024
1033
|
...t.style
|
|
1025
1034
|
},
|
|
1026
1035
|
onScroll: E(t.onScroll, (a) => {
|
|
1027
|
-
const m = a.currentTarget, { contentWrapper: f, shouldExpandOnScrollRef:
|
|
1028
|
-
if (
|
|
1029
|
-
const
|
|
1030
|
-
if (
|
|
1031
|
-
const u = window.innerHeight -
|
|
1036
|
+
const m = a.currentTarget, { contentWrapper: f, shouldExpandOnScrollRef: S } = r;
|
|
1037
|
+
if (S?.current && f) {
|
|
1038
|
+
const h = Math.abs(c.current - m.scrollTop);
|
|
1039
|
+
if (h > 0) {
|
|
1040
|
+
const u = window.innerHeight - G * 2, p = parseFloat(f.style.minHeight), g = parseFloat(f.style.height), C = Math.max(p, g);
|
|
1032
1041
|
if (C < u) {
|
|
1033
|
-
const v = C +
|
|
1034
|
-
f.style.height = `${
|
|
1042
|
+
const v = C + h, x = Math.min(u, v), w = v - x;
|
|
1043
|
+
f.style.height = `${x}px`, f.style.bottom === "0px" && (m.scrollTop = w > 0 ? w : 0, f.style.justifyContent = "flex-end");
|
|
1035
1044
|
}
|
|
1036
1045
|
}
|
|
1037
1046
|
}
|
|
@@ -1043,29 +1052,29 @@ const [_o, He] = ae(
|
|
|
1043
1052
|
}
|
|
1044
1053
|
);
|
|
1045
1054
|
$e.displayName = Ee;
|
|
1046
|
-
const vt = "SelectGroup", [Mo, Oo] = ae(vt), Ue =
|
|
1055
|
+
const vt = "SelectGroup", [Mo, Oo] = ae(vt), Ue = l.forwardRef(
|
|
1047
1056
|
(n, s) => {
|
|
1048
1057
|
const { __scopeSelect: e, ...t } = n, o = oe();
|
|
1049
1058
|
return /* @__PURE__ */ d(Mo, { scope: e, id: o, children: /* @__PURE__ */ d(N.div, { role: "group", "aria-labelledby": o, ...t, ref: s }) });
|
|
1050
1059
|
}
|
|
1051
1060
|
);
|
|
1052
1061
|
Ue.displayName = vt;
|
|
1053
|
-
const St = "SelectLabel", Ke =
|
|
1062
|
+
const St = "SelectLabel", Ke = l.forwardRef(
|
|
1054
1063
|
(n, s) => {
|
|
1055
1064
|
const { __scopeSelect: e, ...t } = n, o = Oo(St, e);
|
|
1056
1065
|
return /* @__PURE__ */ d(N.div, { id: o.id, ...t, ref: s });
|
|
1057
1066
|
}
|
|
1058
1067
|
);
|
|
1059
1068
|
Ke.displayName = St;
|
|
1060
|
-
const xe = "SelectItem", [Do, bt] = ae(xe), We =
|
|
1069
|
+
const xe = "SelectItem", [Do, bt] = ae(xe), We = l.forwardRef(
|
|
1061
1070
|
(n, s) => {
|
|
1062
|
-
const { __scopeSelect: e, value: t, disabled: o = !1, textValue:
|
|
1071
|
+
const { __scopeSelect: e, value: t, disabled: o = !1, textValue: r, ...i } = n, c = Y(xe, e), a = J(xe, e), m = typeof t == "string" ? Array.isArray(c.value) ? c.value.includes(t) : c.value === t : t.every((x) => c.value?.includes(x)), f = Array.isArray(c.value) && Array.isArray(t) && t.some((x) => c.value?.includes(x)), [S, h] = l.useState(r ?? ""), [u, p] = l.useState(!1), g = _(
|
|
1063
1072
|
s,
|
|
1064
|
-
(
|
|
1073
|
+
(x) => a.itemRefCallback?.(x, t, o)
|
|
1065
1074
|
), C = oe(), v = () => {
|
|
1066
1075
|
if (!o) {
|
|
1067
|
-
let
|
|
1068
|
-
f && !m ? c.onValueChange(
|
|
1076
|
+
let x = c.multi && typeof t == "string" ? [t] : t;
|
|
1077
|
+
f && !m ? c.onValueChange(x) : Array.isArray(c.value) && (x = Et(t, c.value)), c.onValueChange(x), c.multi || c.onOpenChange(!1);
|
|
1069
1078
|
}
|
|
1070
1079
|
};
|
|
1071
1080
|
if (!c.multi && Array.isArray(t))
|
|
@@ -1079,10 +1088,10 @@ const xe = "SelectItem", [Do, bt] = ae(xe), We = r.forwardRef(
|
|
|
1079
1088
|
textId: C,
|
|
1080
1089
|
isSelected: m,
|
|
1081
1090
|
isIntermediate: f,
|
|
1082
|
-
onItemTextChange:
|
|
1083
|
-
|
|
1091
|
+
onItemTextChange: l.useCallback((x) => {
|
|
1092
|
+
h((w) => w || (x?.textContent ?? "").trim());
|
|
1084
1093
|
}, []),
|
|
1085
|
-
children: /* @__PURE__ */ d(Ce.ItemSlot, { scope: e, value: t, disabled: o, textValue:
|
|
1094
|
+
children: /* @__PURE__ */ d(Ce.ItemSlot, { scope: e, value: t, disabled: o, textValue: S, children: /* @__PURE__ */ d(
|
|
1086
1095
|
N.div,
|
|
1087
1096
|
{
|
|
1088
1097
|
role: "option",
|
|
@@ -1095,18 +1104,18 @@ const xe = "SelectItem", [Do, bt] = ae(xe), We = r.forwardRef(
|
|
|
1095
1104
|
"data-disabled": o ? "" : void 0,
|
|
1096
1105
|
tabIndex: o ? void 0 : -1,
|
|
1097
1106
|
...i,
|
|
1098
|
-
ref:
|
|
1107
|
+
ref: g,
|
|
1099
1108
|
onFocus: E(i.onFocus, () => p(!0)),
|
|
1100
1109
|
onBlur: E(i.onBlur, () => p(!1)),
|
|
1101
1110
|
onPointerUp: E(i.onPointerUp, v),
|
|
1102
|
-
onPointerMove: E(i.onPointerMove, (
|
|
1103
|
-
o ? a.onItemLeave?.() :
|
|
1111
|
+
onPointerMove: E(i.onPointerMove, (x) => {
|
|
1112
|
+
o ? a.onItemLeave?.() : x.currentTarget.focus({ preventScroll: !0 });
|
|
1104
1113
|
}),
|
|
1105
|
-
onPointerLeave: E(i.onPointerLeave, (
|
|
1106
|
-
|
|
1114
|
+
onPointerLeave: E(i.onPointerLeave, (x) => {
|
|
1115
|
+
x.currentTarget === document.activeElement && a.onItemLeave?.();
|
|
1107
1116
|
}),
|
|
1108
|
-
onKeyDown: E(i.onKeyDown, (
|
|
1109
|
-
a.searchRef?.current !== "" &&
|
|
1117
|
+
onKeyDown: E(i.onKeyDown, (x) => {
|
|
1118
|
+
a.searchRef?.current !== "" && x.key === " " || (bo.includes(x.key) && v(), x.key === " " && x.preventDefault());
|
|
1110
1119
|
})
|
|
1111
1120
|
}
|
|
1112
1121
|
) })
|
|
@@ -1115,14 +1124,14 @@ const xe = "SelectItem", [Do, bt] = ae(xe), We = r.forwardRef(
|
|
|
1115
1124
|
}
|
|
1116
1125
|
);
|
|
1117
1126
|
We.displayName = xe;
|
|
1118
|
-
const fe = "SelectItemText", ze =
|
|
1127
|
+
const fe = "SelectItemText", ze = l.forwardRef(
|
|
1119
1128
|
(n, s) => {
|
|
1120
|
-
const { __scopeSelect: e, className: t, style: o, ...
|
|
1129
|
+
const { __scopeSelect: e, className: t, style: o, ...r } = n, i = Y(fe, e), c = J(fe, e), a = bt(fe, e), m = Eo(fe, e), [f, S] = l.useState(null), h = _(
|
|
1121
1130
|
s,
|
|
1122
|
-
(v) =>
|
|
1131
|
+
(v) => S(v),
|
|
1123
1132
|
a.onItemTextChange,
|
|
1124
1133
|
(v) => c.itemTextRefCallback?.(v, a.value, a.disabled)
|
|
1125
|
-
), u = f?.textContent, p =
|
|
1134
|
+
), u = f?.textContent, p = l.useMemo(
|
|
1126
1135
|
() => /* @__PURE__ */ d(
|
|
1127
1136
|
"option",
|
|
1128
1137
|
{
|
|
@@ -1133,32 +1142,32 @@ const fe = "SelectItemText", ze = r.forwardRef(
|
|
|
1133
1142
|
Array.isArray(a.value) ? a.value.join(";") : a.value
|
|
1134
1143
|
),
|
|
1135
1144
|
[a.disabled, a.value, u]
|
|
1136
|
-
), { onNativeOptionAdd:
|
|
1137
|
-
return
|
|
1138
|
-
/* @__PURE__ */ d(N.span, { id: a.textId, ...
|
|
1139
|
-
a.isSelected && i.valueNode && !i.valueNodeHasChildren ? _e.createPortal(
|
|
1145
|
+
), { onNativeOptionAdd: g, onNativeOptionRemove: C } = m;
|
|
1146
|
+
return B(() => (g(p), () => C(p)), [g, C, p]), /* @__PURE__ */ Ne(Ae, { children: [
|
|
1147
|
+
/* @__PURE__ */ d(N.span, { id: a.textId, ...r, ref: h }),
|
|
1148
|
+
a.isSelected && i.valueNode && !i.valueNodeHasChildren ? _e.createPortal(r.children, i.valueNode) : null
|
|
1140
1149
|
] });
|
|
1141
1150
|
}
|
|
1142
1151
|
);
|
|
1143
1152
|
ze.displayName = fe;
|
|
1144
|
-
const wt = "SelectItemIndicator", Ge =
|
|
1153
|
+
const wt = "SelectItemIndicator", Ge = l.forwardRef(
|
|
1145
1154
|
(n, s) => {
|
|
1146
|
-
const { __scopeSelect: e, children: t, ...o } = n,
|
|
1155
|
+
const { __scopeSelect: e, children: t, ...o } = n, r = bt(wt, e);
|
|
1147
1156
|
return typeof t == "function" ? /* @__PURE__ */ d(N.span, { "aria-hidden": !0, ...o, ref: s, children: t({
|
|
1148
|
-
isSelected:
|
|
1149
|
-
isIntermediate:
|
|
1150
|
-
}) }) :
|
|
1157
|
+
isSelected: r.isSelected,
|
|
1158
|
+
isIntermediate: r.isIntermediate
|
|
1159
|
+
}) }) : r.isSelected ? /* @__PURE__ */ d(N.span, { "aria-hidden": !0, ...o, ref: s, children: t }) : null;
|
|
1151
1160
|
}
|
|
1152
1161
|
);
|
|
1153
1162
|
Ge.displayName = wt;
|
|
1154
|
-
const Pe = "SelectScrollUpButton", je =
|
|
1163
|
+
const Pe = "SelectScrollUpButton", je = l.forwardRef(
|
|
1155
1164
|
(n, s) => {
|
|
1156
|
-
const e = J(Pe, n.__scopeSelect), t = He(Pe, n.__scopeSelect), [o,
|
|
1157
|
-
return
|
|
1165
|
+
const e = J(Pe, n.__scopeSelect), t = He(Pe, n.__scopeSelect), [o, r] = l.useState(!1), i = _(s, t.onScrollButtonChange);
|
|
1166
|
+
return B(() => {
|
|
1158
1167
|
if (e.viewport && e.isPositioned) {
|
|
1159
1168
|
const c = e.viewport, a = () => {
|
|
1160
1169
|
const m = c.scrollTop > 0;
|
|
1161
|
-
|
|
1170
|
+
r(m);
|
|
1162
1171
|
};
|
|
1163
1172
|
return a(), c.addEventListener("scroll", a), () => c.removeEventListener("scroll", a);
|
|
1164
1173
|
}
|
|
@@ -1176,14 +1185,14 @@ const Pe = "SelectScrollUpButton", je = r.forwardRef(
|
|
|
1176
1185
|
}
|
|
1177
1186
|
);
|
|
1178
1187
|
je.displayName = Pe;
|
|
1179
|
-
const Ve = "SelectScrollDownButton", Ye =
|
|
1188
|
+
const Ve = "SelectScrollDownButton", Ye = l.forwardRef(
|
|
1180
1189
|
(n, s) => {
|
|
1181
|
-
const e = J(Ve, n.__scopeSelect), t = He(Ve, n.__scopeSelect), [o,
|
|
1182
|
-
return
|
|
1190
|
+
const e = J(Ve, n.__scopeSelect), t = He(Ve, n.__scopeSelect), [o, r] = l.useState(!1), i = _(s, t.onScrollButtonChange);
|
|
1191
|
+
return B(() => {
|
|
1183
1192
|
if (e.viewport && e.isPositioned) {
|
|
1184
1193
|
const c = e.viewport, a = () => {
|
|
1185
1194
|
const m = c.scrollHeight - c.clientHeight, f = Math.ceil(c.scrollTop) < m;
|
|
1186
|
-
|
|
1195
|
+
r(f);
|
|
1187
1196
|
};
|
|
1188
1197
|
return a(), c.addEventListener("scroll", a), () => c.removeEventListener("scroll", a);
|
|
1189
1198
|
}
|
|
@@ -1201,12 +1210,12 @@ const Ve = "SelectScrollDownButton", Ye = r.forwardRef(
|
|
|
1201
1210
|
}
|
|
1202
1211
|
);
|
|
1203
1212
|
Ye.displayName = Ve;
|
|
1204
|
-
const yt =
|
|
1213
|
+
const yt = l.forwardRef(
|
|
1205
1214
|
(n, s) => {
|
|
1206
|
-
const { __scopeSelect: e, onAutoScroll: t, ...o } = n,
|
|
1215
|
+
const { __scopeSelect: e, onAutoScroll: t, ...o } = n, r = J("SelectScrollButton", e), i = l.useRef(null), c = ge(e), a = l.useCallback(() => {
|
|
1207
1216
|
i.current !== null && (window.clearInterval(i.current), i.current = null);
|
|
1208
1217
|
}, []);
|
|
1209
|
-
return
|
|
1218
|
+
return l.useEffect(() => () => a(), [a]), B(() => {
|
|
1210
1219
|
c().find((f) => f.ref.current === document.activeElement)?.ref.current?.scrollIntoView({ block: "nearest" });
|
|
1211
1220
|
}, [c]), /* @__PURE__ */ d(
|
|
1212
1221
|
N.div,
|
|
@@ -1216,7 +1225,7 @@ const yt = r.forwardRef(
|
|
|
1216
1225
|
ref: s,
|
|
1217
1226
|
style: { flexShrink: 0, ...o.style },
|
|
1218
1227
|
onPointerMove: E(o.onPointerMove, () => {
|
|
1219
|
-
|
|
1228
|
+
r.onItemLeave?.(), i.current === null && (i.current = window.setInterval(t, 50));
|
|
1220
1229
|
}),
|
|
1221
1230
|
onPointerLeave: E(o.onPointerLeave, () => {
|
|
1222
1231
|
a();
|
|
@@ -1224,28 +1233,28 @@ const yt = r.forwardRef(
|
|
|
1224
1233
|
}
|
|
1225
1234
|
);
|
|
1226
1235
|
}
|
|
1227
|
-
), ko = "SelectSeparator", qe =
|
|
1236
|
+
), ko = "SelectSeparator", qe = l.forwardRef(
|
|
1228
1237
|
(n, s) => {
|
|
1229
1238
|
const { __scopeSelect: e, ...t } = n;
|
|
1230
1239
|
return /* @__PURE__ */ d(N.div, { "aria-hidden": !0, ...t, ref: s });
|
|
1231
1240
|
}
|
|
1232
1241
|
);
|
|
1233
1242
|
qe.displayName = ko;
|
|
1234
|
-
const Re = "SelectArrow", Xe =
|
|
1243
|
+
const Re = "SelectArrow", Xe = l.forwardRef(
|
|
1235
1244
|
(n, s) => {
|
|
1236
|
-
const { __scopeSelect: e, ...t } = n, o = ve(e),
|
|
1237
|
-
return
|
|
1245
|
+
const { __scopeSelect: e, ...t } = n, o = ve(e), r = Y(Re, e), i = J(Re, e);
|
|
1246
|
+
return r.open && i.position === "popper" ? /* @__PURE__ */ d(re.Arrow, { ...o, ...t, ref: s }) : null;
|
|
1238
1247
|
}
|
|
1239
1248
|
);
|
|
1240
1249
|
Xe.displayName = Re;
|
|
1241
|
-
const
|
|
1250
|
+
const Fo = "BubbleSelect", Lo = l.forwardRef(
|
|
1242
1251
|
(n, s) => {
|
|
1243
|
-
const { value: e, ...t } = n, o =
|
|
1244
|
-
|
|
1245
|
-
const m = o.current, f = window.HTMLSelectElement.prototype,
|
|
1246
|
-
if (i !== e &&
|
|
1252
|
+
const { value: e, ...t } = n, o = l.useRef(null), r = _(s, o), i = _t(e), c = Y(Fo, void 0);
|
|
1253
|
+
l.useEffect(() => {
|
|
1254
|
+
const m = o.current, f = window.HTMLSelectElement.prototype, h = Object.getOwnPropertyDescriptor(f, "value").set;
|
|
1255
|
+
if (i !== e && h) {
|
|
1247
1256
|
const u = new Event("change", { bubbles: !0 });
|
|
1248
|
-
|
|
1257
|
+
h.call(m, e), m.dispatchEvent(u);
|
|
1249
1258
|
}
|
|
1250
1259
|
}, [i, e]);
|
|
1251
1260
|
let a = e;
|
|
@@ -1254,15 +1263,15 @@ const Lo = "BubbleSelect", Fo = r.forwardRef(
|
|
|
1254
1263
|
{
|
|
1255
1264
|
...t,
|
|
1256
1265
|
multiple: c.multi ? !0 : void 0,
|
|
1257
|
-
ref:
|
|
1266
|
+
ref: r,
|
|
1258
1267
|
defaultValue: a
|
|
1259
1268
|
}
|
|
1260
1269
|
) });
|
|
1261
1270
|
}
|
|
1262
1271
|
);
|
|
1263
|
-
|
|
1272
|
+
Lo.displayName = "BubbleSelect";
|
|
1264
1273
|
function It(n) {
|
|
1265
|
-
const s = At(n), e =
|
|
1274
|
+
const s = At(n), e = l.useRef(""), t = l.useRef(0), o = l.useCallback(
|
|
1266
1275
|
(i) => {
|
|
1267
1276
|
const c = e.current + i;
|
|
1268
1277
|
s(c), function a(m) {
|
|
@@ -1270,14 +1279,14 @@ function It(n) {
|
|
|
1270
1279
|
}(c);
|
|
1271
1280
|
},
|
|
1272
1281
|
[s]
|
|
1273
|
-
),
|
|
1282
|
+
), r = l.useCallback(() => {
|
|
1274
1283
|
e.current = "", window.clearTimeout(t.current);
|
|
1275
1284
|
}, []);
|
|
1276
|
-
return
|
|
1285
|
+
return l.useEffect(() => () => window.clearTimeout(t.current), []), [e, o, r];
|
|
1277
1286
|
}
|
|
1278
1287
|
function Tt(n, s, e) {
|
|
1279
|
-
const o = s.length > 1 && Array.from(s).every((m) => m === s[0]) ? s[0] : s,
|
|
1280
|
-
let i = Bo(n, Math.max(
|
|
1288
|
+
const o = s.length > 1 && Array.from(s).every((m) => m === s[0]) ? s[0] : s, r = e ? n.indexOf(e) : -1;
|
|
1289
|
+
let i = Bo(n, Math.max(r, 0));
|
|
1281
1290
|
o.length === 1 && (i = i.filter((m) => m !== e));
|
|
1282
1291
|
const a = i.find((m) => m.textValue.toLowerCase().startsWith(o.toLowerCase()));
|
|
1283
1292
|
return a !== e ? a : void 0;
|
|
@@ -1290,7 +1299,7 @@ const Et = (n, s = []) => {
|
|
|
1290
1299
|
return n.reduce((t, o) => Et(o, t), s);
|
|
1291
1300
|
const e = s.indexOf(n);
|
|
1292
1301
|
return e === -1 ? [...s, n] : [...s.slice(0, e), ...s.slice(e + 1)];
|
|
1293
|
-
}, Ho = Oe, $o = De, Uo = ke, Ko =
|
|
1302
|
+
}, Ho = Oe, $o = De, Uo = ke, Ko = Fe, Wo = Le, zo = Be, Go = $e, jo = Ue, Yo = Ke, qo = We, Xo = ze, Zo = Ge, Jo = je, Qo = Ye, en = qe, tn = Xe, En = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
1294
1303
|
__proto__: null,
|
|
1295
1304
|
Arrow: tn,
|
|
1296
1305
|
Content: zo,
|
|
@@ -1308,12 +1317,12 @@ const Et = (n, s = []) => {
|
|
|
1308
1317
|
SelectArrow: Xe,
|
|
1309
1318
|
SelectContent: Be,
|
|
1310
1319
|
SelectGroup: Ue,
|
|
1311
|
-
SelectIcon:
|
|
1320
|
+
SelectIcon: Fe,
|
|
1312
1321
|
SelectItem: We,
|
|
1313
1322
|
SelectItemIndicator: Ge,
|
|
1314
1323
|
SelectItemText: ze,
|
|
1315
1324
|
SelectLabel: Ke,
|
|
1316
|
-
SelectPortal:
|
|
1325
|
+
SelectPortal: Le,
|
|
1317
1326
|
SelectScrollDownButton: Ye,
|
|
1318
1327
|
SelectScrollUpButton: je,
|
|
1319
1328
|
SelectSeparator: qe,
|
|
@@ -1328,5 +1337,6 @@ const Et = (n, s = []) => {
|
|
|
1328
1337
|
}, Symbol.toStringTag, { value: "Module" }));
|
|
1329
1338
|
export {
|
|
1330
1339
|
Tn as Combobox,
|
|
1331
|
-
En as Select
|
|
1340
|
+
En as Select,
|
|
1341
|
+
Rn as useCallbackRef
|
|
1332
1342
|
};
|