@gv-tech/ui-web 2.15.0 → 2.15.1

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/drawer.mjs CHANGED
@@ -1,1086 +1,55 @@
1
1
  "use client";
2
- import { j as X } from "./jsx-runtime-tc70JA_2.mjs";
3
- import * as mt from "react";
4
- import r, { useMemo as ve, useLayoutEffect as ye, useEffect as be } from "react";
5
- import { O as Se, C as Te, T as De, D as Re, P as Ee, a as xe, b as Oe, R as Ce } from "./index-DlY82G31.mjs";
6
- import { c as ot } from "./utils-B6yFEsav.mjs";
7
- function $e(t) {
8
- if (typeof document > "u") return;
9
- let n = document.head || document.getElementsByTagName("head")[0], e = document.createElement("style");
10
- e.type = "text/css", n.appendChild(e), e.styleSheet ? e.styleSheet.cssText = t : e.appendChild(document.createTextNode(t));
11
- }
12
- const Yt = r.createContext({
13
- drawerRef: {
14
- current: null
15
- },
16
- overlayRef: {
17
- current: null
18
- },
19
- onPress: () => {
20
- },
21
- onRelease: () => {
22
- },
23
- onDrag: () => {
24
- },
25
- onNestedDrag: () => {
26
- },
27
- onNestedOpenChange: () => {
28
- },
29
- onNestedRelease: () => {
30
- },
31
- openProp: void 0,
32
- dismissible: !1,
33
- isOpen: !1,
34
- isDragging: !1,
35
- keyboardIsOpen: {
36
- current: !1
37
- },
38
- snapPointsOffset: null,
39
- snapPoints: null,
40
- handleOnly: !1,
41
- modal: !1,
42
- shouldFade: !1,
43
- activeSnapPoint: null,
44
- onOpenChange: () => {
45
- },
46
- setActiveSnapPoint: () => {
47
- },
48
- closeDrawer: () => {
49
- },
50
- direction: "bottom",
51
- shouldAnimate: {
52
- current: !0
53
- },
54
- shouldScaleBackground: !1,
55
- setBackgroundColorOnScale: !0,
56
- noBodyStyles: !1,
57
- container: null,
58
- autoFocus: !1
59
- }), pt = () => {
60
- const t = r.useContext(Yt);
61
- if (!t)
62
- throw new Error("useDrawerContext must be used within a Drawer.Root");
63
- return t;
64
- };
65
- $e(`[data-vaul-drawer]{touch-action:none;will-change:transform;transition:transform .5s cubic-bezier(.32, .72, 0, 1);animation-duration:.5s;animation-timing-function:cubic-bezier(0.32,0.72,0,1)}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=bottom][data-state=open]{animation-name:slideFromBottom}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=bottom][data-state=closed]{animation-name:slideToBottom}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=top][data-state=open]{animation-name:slideFromTop}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=top][data-state=closed]{animation-name:slideToTop}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=left][data-state=open]{animation-name:slideFromLeft}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=left][data-state=closed]{animation-name:slideToLeft}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=right][data-state=open]{animation-name:slideFromRight}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=right][data-state=closed]{animation-name:slideToRight}[data-vaul-drawer][data-vaul-snap-points=true][data-vaul-drawer-direction=bottom]{transform:translate3d(0,var(--initial-transform,100%),0)}[data-vaul-drawer][data-vaul-snap-points=true][data-vaul-drawer-direction=top]{transform:translate3d(0,calc(var(--initial-transform,100%) * -1),0)}[data-vaul-drawer][data-vaul-snap-points=true][data-vaul-drawer-direction=left]{transform:translate3d(calc(var(--initial-transform,100%) * -1),0,0)}[data-vaul-drawer][data-vaul-snap-points=true][data-vaul-drawer-direction=right]{transform:translate3d(var(--initial-transform,100%),0,0)}[data-vaul-drawer][data-vaul-delayed-snap-points=true][data-vaul-drawer-direction=top]{transform:translate3d(0,var(--snap-point-height,0),0)}[data-vaul-drawer][data-vaul-delayed-snap-points=true][data-vaul-drawer-direction=bottom]{transform:translate3d(0,var(--snap-point-height,0),0)}[data-vaul-drawer][data-vaul-delayed-snap-points=true][data-vaul-drawer-direction=left]{transform:translate3d(var(--snap-point-height,0),0,0)}[data-vaul-drawer][data-vaul-delayed-snap-points=true][data-vaul-drawer-direction=right]{transform:translate3d(var(--snap-point-height,0),0,0)}[data-vaul-overlay][data-vaul-snap-points=false]{animation-duration:.5s;animation-timing-function:cubic-bezier(0.32,0.72,0,1)}[data-vaul-overlay][data-vaul-snap-points=false][data-state=open]{animation-name:fadeIn}[data-vaul-overlay][data-state=closed]{animation-name:fadeOut}[data-vaul-animate=false]{animation:none!important}[data-vaul-overlay][data-vaul-snap-points=true]{opacity:0;transition:opacity .5s cubic-bezier(.32, .72, 0, 1)}[data-vaul-overlay][data-vaul-snap-points=true]{opacity:1}[data-vaul-drawer]:not([data-vaul-custom-container=true])::after{content:'';position:absolute;background:inherit;background-color:inherit}[data-vaul-drawer][data-vaul-drawer-direction=top]::after{top:initial;bottom:100%;left:0;right:0;height:200%}[data-vaul-drawer][data-vaul-drawer-direction=bottom]::after{top:100%;bottom:initial;left:0;right:0;height:200%}[data-vaul-drawer][data-vaul-drawer-direction=left]::after{left:initial;right:100%;top:0;bottom:0;width:200%}[data-vaul-drawer][data-vaul-drawer-direction=right]::after{left:100%;right:initial;top:0;bottom:0;width:200%}[data-vaul-overlay][data-vaul-snap-points=true]:not([data-vaul-snap-points-overlay=true]):not(
66
- [data-state=closed]
67
- ){opacity:0}[data-vaul-overlay][data-vaul-snap-points-overlay=true]{opacity:1}[data-vaul-handle]{display:block;position:relative;opacity:.7;background:#e2e2e4;margin-left:auto;margin-right:auto;height:5px;width:32px;border-radius:1rem;touch-action:pan-y}[data-vaul-handle]:active,[data-vaul-handle]:hover{opacity:1}[data-vaul-handle-hitarea]{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:max(100%,2.75rem);height:max(100%,2.75rem);touch-action:inherit}@media (hover:hover) and (pointer:fine){[data-vaul-drawer]{user-select:none}}@media (pointer:fine){[data-vaul-handle-hitarea]:{width:100%;height:100%}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeOut{to{opacity:0}}@keyframes slideFromBottom{from{transform:translate3d(0,var(--initial-transform,100%),0)}to{transform:translate3d(0,0,0)}}@keyframes slideToBottom{to{transform:translate3d(0,var(--initial-transform,100%),0)}}@keyframes slideFromTop{from{transform:translate3d(0,calc(var(--initial-transform,100%) * -1),0)}to{transform:translate3d(0,0,0)}}@keyframes slideToTop{to{transform:translate3d(0,calc(var(--initial-transform,100%) * -1),0)}}@keyframes slideFromLeft{from{transform:translate3d(calc(var(--initial-transform,100%) * -1),0,0)}to{transform:translate3d(0,0,0)}}@keyframes slideToLeft{to{transform:translate3d(calc(var(--initial-transform,100%) * -1),0,0)}}@keyframes slideFromRight{from{transform:translate3d(var(--initial-transform,100%),0,0)}to{transform:translate3d(0,0,0)}}@keyframes slideToRight{to{transform:translate3d(var(--initial-transform,100%),0,0)}}`);
68
- function Ae() {
69
- const t = navigator.userAgent;
70
- return typeof window < "u" && (/Firefox/.test(t) && /Mobile/.test(t) || // Android Firefox
71
- /FxiOS/.test(t));
72
- }
73
- function Me() {
74
- return Mt(/^Mac/);
75
- }
76
- function Ne() {
77
- return Mt(/^iPhone/);
78
- }
79
- function jt() {
80
- return /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
81
- }
82
- function Pe() {
83
- return Mt(/^iPad/) || // iPadOS 13 lies and says it's a Mac, but we can distinguish by detecting touch support.
84
- Me() && navigator.maxTouchPoints > 1;
85
- }
86
- function qt() {
87
- return Ne() || Pe();
88
- }
89
- function Mt(t) {
90
- return typeof window < "u" && window.navigator != null ? t.test(window.navigator.platform) : void 0;
91
- }
92
- const Ie = 24, _e = typeof window < "u" ? ye : be;
93
- function Wt(...t) {
94
- return (...n) => {
95
- for (let e of t)
96
- typeof e == "function" && e(...n);
97
- };
98
- }
99
- const Et = typeof document < "u" && window.visualViewport;
100
- function zt(t) {
101
- let n = window.getComputedStyle(t);
102
- return /(auto|scroll)/.test(n.overflow + n.overflowX + n.overflowY);
103
- }
104
- function Xt(t) {
105
- for (zt(t) && (t = t.parentElement); t && !zt(t); )
106
- t = t.parentElement;
107
- return t || document.scrollingElement || document.documentElement;
108
- }
109
- const He = /* @__PURE__ */ new Set([
110
- "checkbox",
111
- "radio",
112
- "range",
113
- "color",
114
- "file",
115
- "image",
116
- "button",
117
- "submit",
118
- "reset"
119
- ]);
120
- let vt = 0, xt;
121
- function ke(t = {}) {
122
- let { isDisabled: n } = t;
123
- _e(() => {
124
- if (!n)
125
- return vt++, vt === 1 && qt() && (xt = Le()), () => {
126
- vt--, vt === 0 && xt?.();
127
- };
128
- }, [
129
- n
130
- ]);
131
- }
132
- function Le() {
133
- let t, n = 0, e = (f) => {
134
- t = Xt(f.target), !(t === document.documentElement && t === document.body) && (n = f.changedTouches[0].pageY);
135
- }, a = (f) => {
136
- if (!t || t === document.documentElement || t === document.body) {
137
- f.preventDefault();
138
- return;
139
- }
140
- let m = f.changedTouches[0].pageY, B = t.scrollTop, k = t.scrollHeight - t.clientHeight;
141
- k !== 0 && ((B <= 0 && m > n || B >= k && m < n) && f.preventDefault(), n = m);
142
- }, i = (f) => {
143
- let m = f.target;
144
- $t(m) && m !== document.activeElement && (f.preventDefault(), m.style.transform = "translateY(-2000px)", m.focus(), requestAnimationFrame(() => {
145
- m.style.transform = "";
146
- }));
147
- }, o = (f) => {
148
- let m = f.target;
149
- $t(m) && (m.style.transform = "translateY(-2000px)", requestAnimationFrame(() => {
150
- m.style.transform = "", Et && (Et.height < window.innerHeight ? requestAnimationFrame(() => {
151
- Vt(m);
152
- }) : Et.addEventListener("resize", () => Vt(m), {
153
- once: !0
154
- }));
155
- }));
156
- }, v = () => {
157
- window.scrollTo(0, 0);
158
- }, w = window.pageXOffset, T = window.pageYOffset, R = Wt(Be(document.documentElement, "paddingRight", `${window.innerWidth - document.documentElement.clientWidth}px`));
159
- window.scrollTo(0, 0);
160
- let h = Wt(dt(document, "touchstart", e, {
161
- passive: !1,
162
- capture: !0
163
- }), dt(document, "touchmove", a, {
164
- passive: !1,
165
- capture: !0
166
- }), dt(document, "touchend", i, {
167
- passive: !1,
168
- capture: !0
169
- }), dt(document, "focus", o, !0), dt(window, "scroll", v));
170
- return () => {
171
- R(), h(), window.scrollTo(w, T);
172
- };
173
- }
174
- function Be(t, n, e) {
175
- let a = t.style[n];
176
- return t.style[n] = e, () => {
177
- t.style[n] = a;
178
- };
179
- }
180
- function dt(t, n, e, a) {
181
- return t.addEventListener(n, e, a), () => {
182
- t.removeEventListener(n, e, a);
183
- };
184
- }
185
- function Vt(t) {
186
- let n = document.scrollingElement || document.documentElement;
187
- for (; t && t !== n; ) {
188
- let e = Xt(t);
189
- if (e !== document.documentElement && e !== document.body && e !== t) {
190
- let a = e.getBoundingClientRect().top, i = t.getBoundingClientRect().top, o = t.getBoundingClientRect().bottom;
191
- const v = e.getBoundingClientRect().bottom + Ie;
192
- o > v && (e.scrollTop += i - a);
193
- }
194
- t = e.parentElement;
195
- }
196
- }
197
- function $t(t) {
198
- return t instanceof HTMLInputElement && !He.has(t.type) || t instanceof HTMLTextAreaElement || t instanceof HTMLElement && t.isContentEditable;
199
- }
200
- function Fe(t, n) {
201
- typeof t == "function" ? t(n) : t != null && (t.current = n);
202
- }
203
- function Ue(...t) {
204
- return (n) => t.forEach((e) => Fe(e, n));
205
- }
206
- function Kt(...t) {
207
- return mt.useCallback(Ue(...t), t);
208
- }
209
- const Gt = /* @__PURE__ */ new WeakMap();
210
- function $(t, n, e = !1) {
211
- if (!t || !(t instanceof HTMLElement)) return;
212
- let a = {};
213
- Object.entries(n).forEach(([i, o]) => {
214
- if (i.startsWith("--")) {
215
- t.style.setProperty(i, o);
216
- return;
217
- }
218
- a[i] = t.style[i], t.style[i] = o;
219
- }), !e && Gt.set(t, a);
220
- }
221
- function je(t, n) {
222
- if (!t || !(t instanceof HTMLElement)) return;
223
- let e = Gt.get(t);
224
- e && (t.style[n] = e[n]);
225
- }
226
- const C = (t) => {
227
- switch (t) {
228
- case "top":
229
- case "bottom":
230
- return !0;
231
- case "left":
232
- case "right":
233
- return !1;
234
- default:
235
- return t;
236
- }
237
- };
238
- function yt(t, n) {
239
- if (!t)
240
- return null;
241
- const e = window.getComputedStyle(t), a = (
242
- // @ts-ignore
243
- e.transform || e.webkitTransform || e.mozTransform
244
- );
245
- let i = a.match(/^matrix3d\((.+)\)$/);
246
- return i ? parseFloat(i[1].split(", ")[C(n) ? 13 : 12]) : (i = a.match(/^matrix\((.+)\)$/), i ? parseFloat(i[1].split(", ")[C(n) ? 5 : 4]) : null);
247
- }
248
- function We(t) {
249
- return 8 * (Math.log(t + 1) - 2);
250
- }
251
- function Ot(t, n) {
252
- if (!t) return () => {
253
- };
254
- const e = t.style.cssText;
255
- return Object.assign(t.style, n), () => {
256
- t.style.cssText = e;
257
- };
258
- }
259
- function ze(...t) {
260
- return (...n) => {
261
- for (const e of t)
262
- typeof e == "function" && e(...n);
263
- };
264
- }
265
- const x = {
266
- DURATION: 0.5,
267
- EASE: [
268
- 0.32,
269
- 0.72,
270
- 0,
271
- 1
272
- ]
273
- }, Jt = 0.4, Ve = 0.25, Ye = 100, Qt = 8, et = 16, At = 26, Ct = "vaul-dragging";
274
- function Zt(t) {
275
- const n = r.useRef(t);
276
- return r.useEffect(() => {
277
- n.current = t;
278
- }), r.useMemo(() => (...e) => n.current == null ? void 0 : n.current.call(n, ...e), []);
279
- }
280
- function qe({ defaultProp: t, onChange: n }) {
281
- const e = r.useState(t), [a] = e, i = r.useRef(a), o = Zt(n);
282
- return r.useEffect(() => {
283
- i.current !== a && (o(a), i.current = a);
284
- }, [
285
- a,
286
- i,
287
- o
288
- ]), e;
289
- }
290
- function te({ prop: t, defaultProp: n, onChange: e = () => {
291
- } }) {
292
- const [a, i] = qe({
293
- defaultProp: n,
294
- onChange: e
295
- }), o = t !== void 0, v = o ? t : a, w = Zt(e), T = r.useCallback((R) => {
296
- if (o) {
297
- const f = typeof R == "function" ? R(t) : R;
298
- f !== t && w(f);
299
- } else
300
- i(R);
301
- }, [
302
- o,
303
- t,
304
- i,
305
- w
306
- ]);
307
- return [
308
- v,
309
- T
310
- ];
311
- }
312
- function Xe({ activeSnapPointProp: t, setActiveSnapPointProp: n, snapPoints: e, drawerRef: a, overlayRef: i, fadeFromIndex: o, onSnapPointChange: v, direction: w = "bottom", container: T, snapToSequentialPoint: R }) {
313
- const [h, f] = te({
314
- prop: t,
315
- defaultProp: e?.[0],
316
- onChange: n
317
- }), [m, B] = r.useState(typeof window < "u" ? {
318
- innerWidth: window.innerWidth,
319
- innerHeight: window.innerHeight
320
- } : void 0);
321
- r.useEffect(() => {
322
- function u() {
323
- B({
324
- innerWidth: window.innerWidth,
325
- innerHeight: window.innerHeight
326
- });
327
- }
328
- return window.addEventListener("resize", u), () => window.removeEventListener("resize", u);
329
- }, []);
330
- const k = r.useMemo(() => h === e?.[e.length - 1] || null, [
331
- e,
332
- h
333
- ]), E = r.useMemo(() => {
334
- var u;
335
- return (u = e?.findIndex((b) => b === h)) != null ? u : null;
336
- }, [
337
- e,
338
- h
339
- ]), F = e && e.length > 0 && (o || o === 0) && !Number.isNaN(o) && e[o] === h || !e, p = r.useMemo(() => {
340
- const u = T ? {
341
- width: T.getBoundingClientRect().width,
342
- height: T.getBoundingClientRect().height
343
- } : typeof window < "u" ? {
344
- width: window.innerWidth,
345
- height: window.innerHeight
346
- } : {
347
- width: 0,
348
- height: 0
349
- };
350
- var b;
351
- return (b = e?.map((y) => {
352
- const I = typeof y == "string";
353
- let N = 0;
354
- if (I && (N = parseInt(y, 10)), C(w)) {
355
- const l = I ? N : m ? y * u.height : 0;
356
- return m ? w === "bottom" ? u.height - l : -u.height + l : l;
357
- }
358
- const j = I ? N : m ? y * u.width : 0;
359
- return m ? w === "right" ? u.width - j : -u.width + j : j;
360
- })) != null ? b : [];
361
- }, [
362
- e,
363
- m,
364
- T
365
- ]), M = r.useMemo(() => E !== null ? p?.[E] : null, [
366
- p,
367
- E
368
- ]), A = r.useCallback((u) => {
369
- var b;
370
- const y = (b = p?.findIndex((I) => I === u)) != null ? b : null;
371
- v(y), $(a.current, {
372
- transition: `transform ${x.DURATION}s cubic-bezier(${x.EASE.join(",")})`,
373
- transform: C(w) ? `translate3d(0, ${u}px, 0)` : `translate3d(${u}px, 0, 0)`
374
- }), p && y !== p.length - 1 && o !== void 0 && y !== o && y < o ? $(i.current, {
375
- transition: `opacity ${x.DURATION}s cubic-bezier(${x.EASE.join(",")})`,
376
- opacity: "0"
377
- }) : $(i.current, {
378
- transition: `opacity ${x.DURATION}s cubic-bezier(${x.EASE.join(",")})`,
379
- opacity: "1"
380
- }), f(e?.[Math.max(y, 0)]);
381
- }, [
382
- a.current,
383
- e,
384
- p,
385
- o,
386
- i,
387
- f
388
- ]);
389
- r.useEffect(() => {
390
- if (h || t) {
391
- var u;
392
- const b = (u = e?.findIndex((y) => y === t || y === h)) != null ? u : -1;
393
- p && b !== -1 && typeof p[b] == "number" && A(p[b]);
394
- }
395
- }, [
396
- h,
397
- t,
398
- e,
399
- p,
400
- A
401
- ]);
402
- function c({ draggedDistance: u, closeDrawer: b, velocity: y, dismissible: I }) {
403
- if (o === void 0) return;
404
- const N = w === "bottom" || w === "right" ? (M ?? 0) - u : (M ?? 0) + u, j = E === o - 1, l = E === 0, U = u > 0;
405
- if (j && $(i.current, {
406
- transition: `opacity ${x.DURATION}s cubic-bezier(${x.EASE.join(",")})`
407
- }), !R && y > 2 && !U) {
408
- I ? b() : A(p[0]);
409
- return;
410
- }
411
- if (!R && y > 2 && U && p && e) {
412
- A(p[e.length - 1]);
413
- return;
414
- }
415
- const _ = p?.reduce((P, K) => typeof P != "number" || typeof K != "number" ? P : Math.abs(K - N) < Math.abs(P - N) ? K : P), W = C(w) ? window.innerHeight : window.innerWidth;
416
- if (y > Jt && Math.abs(u) < W * 0.4) {
417
- const P = U ? 1 : -1;
418
- if (P > 0 && k && e) {
419
- A(p[e.length - 1]);
420
- return;
421
- }
422
- if (l && P < 0 && I && b(), E === null) return;
423
- A(p[E + P]);
424
- return;
425
- }
426
- A(_);
427
- }
428
- function Y({ draggedDistance: u }) {
429
- if (M === null) return;
430
- const b = w === "bottom" || w === "right" ? M - u : M + u;
431
- (w === "bottom" || w === "right") && b < p[p.length - 1] || (w === "top" || w === "left") && b > p[p.length - 1] || $(a.current, {
432
- transform: C(w) ? `translate3d(0, ${b}px, 0)` : `translate3d(${b}px, 0, 0)`
433
- });
434
- }
435
- function Z(u, b) {
436
- if (!e || typeof E != "number" || !p || o === void 0) return null;
437
- const y = E === o - 1;
438
- if (E >= o && b)
439
- return 0;
440
- if (y && !b) return 1;
441
- if (!F && !y) return null;
442
- const N = y ? E + 1 : E - 1, j = y ? p[N] - p[N - 1] : p[N + 1] - p[N], l = u / Math.abs(j);
443
- return y ? 1 - l : l;
444
- }
445
- return {
446
- isLastSnapPoint: k,
447
- activeSnapPoint: h,
448
- shouldFade: F,
449
- getPercentageDragged: Z,
450
- setActiveSnapPoint: f,
451
- activeSnapPointIndex: E,
452
- onRelease: c,
453
- onDrag: Y,
454
- snapPointsOffset: p
455
- };
456
- }
457
- const Ke = () => () => {
458
- };
459
- function Ge() {
460
- const { direction: t, isOpen: n, shouldScaleBackground: e, setBackgroundColorOnScale: a, noBodyStyles: i } = pt(), o = r.useRef(null), v = ve(() => document.body.style.backgroundColor, []);
461
- function w() {
462
- return (window.innerWidth - At) / window.innerWidth;
463
- }
464
- r.useEffect(() => {
465
- if (n && e) {
466
- o.current && clearTimeout(o.current);
467
- const T = document.querySelector("[data-vaul-drawer-wrapper]") || document.querySelector("[vaul-drawer-wrapper]");
468
- if (!T) return;
469
- ze(a && !i ? Ot(document.body, {
470
- background: "black"
471
- }) : Ke, Ot(T, {
472
- transformOrigin: C(t) ? "top" : "left",
473
- transitionProperty: "transform, border-radius",
474
- transitionDuration: `${x.DURATION}s`,
475
- transitionTimingFunction: `cubic-bezier(${x.EASE.join(",")})`
476
- }));
477
- const R = Ot(T, {
478
- borderRadius: `${Qt}px`,
479
- overflow: "hidden",
480
- ...C(t) ? {
481
- transform: `scale(${w()}) translate3d(0, calc(env(safe-area-inset-top) + 14px), 0)`
482
- } : {
483
- transform: `scale(${w()}) translate3d(calc(env(safe-area-inset-top) + 14px), 0, 0)`
484
- }
485
- });
486
- return () => {
487
- R(), o.current = window.setTimeout(() => {
488
- v ? document.body.style.background = v : document.body.style.removeProperty("background");
489
- }, x.DURATION * 1e3);
490
- };
491
- }
492
- }, [
493
- n,
494
- e,
495
- v
496
- ]);
497
- }
498
- let ft = null;
499
- function Je({ isOpen: t, modal: n, nested: e, hasBeenOpened: a, preventScrollRestoration: i, noBodyStyles: o }) {
500
- const [v, w] = r.useState(() => typeof window < "u" ? window.location.href : ""), T = r.useRef(0), R = r.useCallback(() => {
501
- if (jt() && ft === null && t && !o) {
502
- ft = {
503
- position: document.body.style.position,
504
- top: document.body.style.top,
505
- left: document.body.style.left,
506
- height: document.body.style.height,
507
- right: "unset"
508
- };
509
- const { scrollX: f, innerHeight: m } = window;
510
- document.body.style.setProperty("position", "fixed", "important"), Object.assign(document.body.style, {
511
- top: `${-T.current}px`,
512
- left: `${-f}px`,
513
- right: "0px",
514
- height: "auto"
515
- }), window.setTimeout(() => window.requestAnimationFrame(() => {
516
- const B = m - window.innerHeight;
517
- B && T.current >= m && (document.body.style.top = `${-(T.current + B)}px`);
518
- }), 300);
519
- }
520
- }, [
521
- t
522
- ]), h = r.useCallback(() => {
523
- if (jt() && ft !== null && !o) {
524
- const f = -parseInt(document.body.style.top, 10), m = -parseInt(document.body.style.left, 10);
525
- Object.assign(document.body.style, ft), window.requestAnimationFrame(() => {
526
- if (i && v !== window.location.href) {
527
- w(window.location.href);
528
- return;
529
- }
530
- window.scrollTo(m, f);
531
- }), ft = null;
532
- }
533
- }, [
534
- v
535
- ]);
536
- return r.useEffect(() => {
537
- function f() {
538
- T.current = window.scrollY;
539
- }
540
- return f(), window.addEventListener("scroll", f), () => {
541
- window.removeEventListener("scroll", f);
542
- };
543
- }, []), r.useEffect(() => {
544
- if (n)
545
- return () => {
546
- typeof document > "u" || document.querySelector("[data-vaul-drawer]") || h();
547
- };
548
- }, [
549
- n,
550
- h
551
- ]), r.useEffect(() => {
552
- e || !a || (t ? (!window.matchMedia("(display-mode: standalone)").matches && R(), n || window.setTimeout(() => {
553
- h();
554
- }, 500)) : h());
555
- }, [
556
- t,
557
- a,
558
- v,
559
- n,
560
- e,
561
- R,
562
- h
563
- ]), {
564
- restorePositionSetting: h
565
- };
566
- }
567
- function Qe({ open: t, onOpenChange: n, children: e, onDrag: a, onRelease: i, snapPoints: o, shouldScaleBackground: v = !1, setBackgroundColorOnScale: w = !0, closeThreshold: T = Ve, scrollLockTimeout: R = Ye, dismissible: h = !0, handleOnly: f = !1, fadeFromIndex: m = o && o.length - 1, activeSnapPoint: B, setActiveSnapPoint: k, fixed: E, modal: F = !0, onClose: p, nested: M, noBodyStyles: A = !1, direction: c = "bottom", defaultOpen: Y = !1, disablePreventScroll: Z = !0, snapToSequentialPoint: u = !1, preventScrollRestoration: b = !1, repositionInputs: y = !0, onAnimationEnd: I, container: N, autoFocus: j = !1 }) {
568
- var l, U;
569
- const [_ = !1, W] = te({
570
- defaultProp: Y,
571
- prop: t,
572
- onChange: (s) => {
573
- n?.(s), !s && !M && ce(), setTimeout(() => {
574
- I?.(s);
575
- }, x.DURATION * 1e3), s && !F && typeof window < "u" && window.requestAnimationFrame(() => {
576
- document.body.style.pointerEvents = "auto";
577
- }), s || (document.body.style.pointerEvents = "auto");
578
- }
579
- }), [P, K] = r.useState(!1), [G, it] = r.useState(!1), [ae, Nt] = r.useState(!1), nt = r.useRef(null), wt = r.useRef(null), bt = r.useRef(null), St = r.useRef(null), st = r.useRef(null), lt = r.useRef(!1), Tt = r.useRef(null), Dt = r.useRef(0), rt = r.useRef(!1), Pt = r.useRef(!Y), It = r.useRef(0), d = r.useRef(null), _t = r.useRef(((l = d.current) == null ? void 0 : l.getBoundingClientRect().height) || 0), Ht = r.useRef(((U = d.current) == null ? void 0 : U.getBoundingClientRect().width) || 0), Rt = r.useRef(0), oe = r.useCallback((s) => {
580
- o && s === ut.length - 1 && (wt.current = /* @__PURE__ */ new Date());
581
- }, []), { activeSnapPoint: ie, activeSnapPointIndex: at, setActiveSnapPoint: kt, onRelease: se, snapPointsOffset: ut, onDrag: le, shouldFade: Lt, getPercentageDragged: ue } = Xe({
582
- snapPoints: o,
583
- activeSnapPointProp: B,
584
- setActiveSnapPointProp: k,
585
- drawerRef: d,
586
- fadeFromIndex: m,
587
- overlayRef: nt,
588
- onSnapPointChange: oe,
589
- direction: c,
590
- container: N,
591
- snapToSequentialPoint: u
592
- });
593
- ke({
594
- isDisabled: !_ || G || !F || ae || !P || !y || !Z
595
- });
596
- const { restorePositionSetting: ce } = Je({
597
- isOpen: _,
598
- modal: F,
599
- nested: M ?? !1,
600
- hasBeenOpened: P,
601
- preventScrollRestoration: b,
602
- noBodyStyles: A
603
- });
604
- function ht() {
605
- return (window.innerWidth - At) / window.innerWidth;
606
- }
607
- function de(s) {
608
- var S, D;
609
- !h && !o || d.current && !d.current.contains(s.target) || (_t.current = ((S = d.current) == null ? void 0 : S.getBoundingClientRect().height) || 0, Ht.current = ((D = d.current) == null ? void 0 : D.getBoundingClientRect().width) || 0, it(!0), bt.current = /* @__PURE__ */ new Date(), qt() && window.addEventListener("touchend", () => lt.current = !1, {
610
- once: !0
611
- }), s.target.setPointerCapture(s.pointerId), Dt.current = C(c) ? s.pageY : s.pageX);
612
- }
613
- function Bt(s, S) {
614
- var D;
615
- let g = s;
616
- const O = (D = window.getSelection()) == null ? void 0 : D.toString(), L = d.current ? yt(d.current, c) : null, H = /* @__PURE__ */ new Date();
617
- if (g.tagName === "SELECT" || g.hasAttribute("data-vaul-no-drag") || g.closest("[data-vaul-no-drag]"))
618
- return !1;
619
- if (c === "right" || c === "left")
620
- return !0;
621
- if (wt.current && H.getTime() - wt.current.getTime() < 500)
622
- return !1;
623
- if (L !== null && (c === "bottom" ? L > 0 : L < 0))
624
- return !0;
625
- if (O && O.length > 0)
626
- return !1;
627
- if (st.current && H.getTime() - st.current.getTime() < R && L === 0 || S)
628
- return st.current = H, !1;
629
- for (; g; ) {
630
- if (g.scrollHeight > g.clientHeight) {
631
- if (g.scrollTop !== 0)
632
- return st.current = /* @__PURE__ */ new Date(), !1;
633
- if (g.getAttribute("role") === "dialog")
634
- return !0;
635
- }
636
- g = g.parentNode;
637
- }
638
- return !0;
639
- }
640
- function fe(s) {
641
- if (d.current && G) {
642
- const S = c === "bottom" || c === "right" ? 1 : -1, D = (Dt.current - (C(c) ? s.pageY : s.pageX)) * S, g = D > 0, O = o && !h && !g;
643
- if (O && at === 0) return;
644
- const L = Math.abs(D), H = document.querySelector("[data-vaul-drawer-wrapper]"), J = c === "bottom" || c === "top" ? _t.current : Ht.current;
645
- let z = L / J;
646
- const tt = ue(L, g);
647
- if (tt !== null && (z = tt), O && z >= 1 || !lt.current && !Bt(s.target, g)) return;
648
- if (d.current.classList.add(Ct), lt.current = !0, $(d.current, {
649
- transition: "none"
650
- }), $(nt.current, {
651
- transition: "none"
652
- }), o && le({
653
- draggedDistance: D
654
- }), g && !o) {
655
- const q = We(D), gt = Math.min(q * -1, 0) * S;
656
- $(d.current, {
657
- transform: C(c) ? `translate3d(0, ${gt}px, 0)` : `translate3d(${gt}px, 0, 0)`
658
- });
659
- return;
660
- }
661
- const Q = 1 - z;
662
- if ((Lt || m && at === m - 1) && (a?.(s, z), $(nt.current, {
663
- opacity: `${Q}`,
664
- transition: "none"
665
- }, !0)), H && nt.current && v) {
666
- const q = Math.min(ht() + z * (1 - ht()), 1), gt = 8 - z * 8, Ut = Math.max(0, 14 - z * 14);
667
- $(H, {
668
- borderRadius: `${gt}px`,
669
- transform: C(c) ? `scale(${q}) translate3d(0, ${Ut}px, 0)` : `scale(${q}) translate3d(${Ut}px, 0, 0)`,
670
- transition: "none"
671
- }, !0);
672
- }
673
- if (!o) {
674
- const q = L * S;
675
- $(d.current, {
676
- transform: C(c) ? `translate3d(0, ${q}px, 0)` : `translate3d(${q}px, 0, 0)`
677
- });
678
- }
679
- }
680
- }
681
- r.useEffect(() => {
682
- window.requestAnimationFrame(() => {
683
- Pt.current = !0;
684
- });
685
- }, []), r.useEffect(() => {
686
- var s;
687
- function S() {
688
- if (!d.current || !y) return;
689
- const D = document.activeElement;
690
- if ($t(D) || rt.current) {
691
- var g;
692
- const O = ((g = window.visualViewport) == null ? void 0 : g.height) || 0, L = window.innerHeight;
693
- let H = L - O;
694
- const J = d.current.getBoundingClientRect().height || 0, z = J > L * 0.8;
695
- Rt.current || (Rt.current = J);
696
- const tt = d.current.getBoundingClientRect().top;
697
- if (Math.abs(It.current - H) > 60 && (rt.current = !rt.current), o && o.length > 0 && ut && at) {
698
- const Q = ut[at] || 0;
699
- H += Q;
700
- }
701
- if (It.current = H, J > O || rt.current) {
702
- const Q = d.current.getBoundingClientRect().height;
703
- let q = Q;
704
- Q > O && (q = O - (z ? tt : At)), E ? d.current.style.height = `${Q - Math.max(H, 0)}px` : d.current.style.height = `${Math.max(q, O - tt)}px`;
705
- } else Ae() || (d.current.style.height = `${Rt.current}px`);
706
- o && o.length > 0 && !rt.current ? d.current.style.bottom = "0px" : d.current.style.bottom = `${Math.max(H, 0)}px`;
707
- }
708
- }
709
- return (s = window.visualViewport) == null || s.addEventListener("resize", S), () => {
710
- var D;
711
- return (D = window.visualViewport) == null ? void 0 : D.removeEventListener("resize", S);
712
- };
713
- }, [
714
- at,
715
- o,
716
- ut
717
- ]);
718
- function ct(s) {
719
- me(), p?.(), s || W(!1), setTimeout(() => {
720
- o && kt(o[0]);
721
- }, x.DURATION * 1e3);
722
- }
723
- function Ft() {
724
- if (!d.current) return;
725
- const s = document.querySelector("[data-vaul-drawer-wrapper]"), S = yt(d.current, c);
726
- $(d.current, {
727
- transform: "translate3d(0, 0, 0)",
728
- transition: `transform ${x.DURATION}s cubic-bezier(${x.EASE.join(",")})`
729
- }), $(nt.current, {
730
- transition: `opacity ${x.DURATION}s cubic-bezier(${x.EASE.join(",")})`,
731
- opacity: "1"
732
- }), v && S && S > 0 && _ && $(s, {
733
- borderRadius: `${Qt}px`,
734
- overflow: "hidden",
735
- ...C(c) ? {
736
- transform: `scale(${ht()}) translate3d(0, calc(env(safe-area-inset-top) + 14px), 0)`,
737
- transformOrigin: "top"
738
- } : {
739
- transform: `scale(${ht()}) translate3d(calc(env(safe-area-inset-top) + 14px), 0, 0)`,
740
- transformOrigin: "left"
741
- },
742
- transitionProperty: "transform, border-radius",
743
- transitionDuration: `${x.DURATION}s`,
744
- transitionTimingFunction: `cubic-bezier(${x.EASE.join(",")})`
745
- }, !0);
746
- }
747
- function me() {
748
- !G || !d.current || (d.current.classList.remove(Ct), lt.current = !1, it(!1), St.current = /* @__PURE__ */ new Date());
749
- }
750
- function pe(s) {
751
- if (!G || !d.current) return;
752
- d.current.classList.remove(Ct), lt.current = !1, it(!1), St.current = /* @__PURE__ */ new Date();
753
- const S = yt(d.current, c);
754
- if (!s || !Bt(s.target, !1) || !S || Number.isNaN(S) || bt.current === null) return;
755
- const D = St.current.getTime() - bt.current.getTime(), g = Dt.current - (C(c) ? s.pageY : s.pageX), O = Math.abs(g) / D;
756
- if (O > 0.05 && (Nt(!0), setTimeout(() => {
757
- Nt(!1);
758
- }, 200)), o) {
759
- se({
760
- draggedDistance: g * (c === "bottom" || c === "right" ? 1 : -1),
761
- closeDrawer: ct,
762
- velocity: O,
763
- dismissible: h
764
- }), i?.(s, !0);
765
- return;
766
- }
767
- if (c === "bottom" || c === "right" ? g > 0 : g < 0) {
768
- Ft(), i?.(s, !0);
769
- return;
770
- }
771
- if (O > Jt) {
772
- ct(), i?.(s, !1);
773
- return;
774
- }
775
- var L;
776
- const H = Math.min((L = d.current.getBoundingClientRect().height) != null ? L : 0, window.innerHeight);
777
- var J;
778
- const z = Math.min((J = d.current.getBoundingClientRect().width) != null ? J : 0, window.innerWidth), tt = c === "left" || c === "right";
779
- if (Math.abs(S) >= (tt ? z : H) * T) {
780
- ct(), i?.(s, !1);
781
- return;
782
- }
783
- i?.(s, !0), Ft();
784
- }
785
- r.useEffect(() => (_ && ($(document.documentElement, {
786
- scrollBehavior: "auto"
787
- }), wt.current = /* @__PURE__ */ new Date()), () => {
788
- je(document.documentElement, "scrollBehavior");
789
- }), [
790
- _
791
- ]);
792
- function we(s) {
793
- const S = s ? (window.innerWidth - et) / window.innerWidth : 1, D = s ? -et : 0;
794
- Tt.current && window.clearTimeout(Tt.current), $(d.current, {
795
- transition: `transform ${x.DURATION}s cubic-bezier(${x.EASE.join(",")})`,
796
- transform: C(c) ? `scale(${S}) translate3d(0, ${D}px, 0)` : `scale(${S}) translate3d(${D}px, 0, 0)`
797
- }), !s && d.current && (Tt.current = setTimeout(() => {
798
- const g = yt(d.current, c);
799
- $(d.current, {
800
- transition: "none",
801
- transform: C(c) ? `translate3d(0, ${g}px, 0)` : `translate3d(${g}px, 0, 0)`
802
- });
803
- }, 500));
804
- }
805
- function he(s, S) {
806
- if (S < 0) return;
807
- const D = (window.innerWidth - et) / window.innerWidth, g = D + S * (1 - D), O = -et + S * et;
808
- $(d.current, {
809
- transform: C(c) ? `scale(${g}) translate3d(0, ${O}px, 0)` : `scale(${g}) translate3d(${O}px, 0, 0)`,
810
- transition: "none"
811
- });
812
- }
813
- function ge(s, S) {
814
- const D = C(c) ? window.innerHeight : window.innerWidth, g = S ? (D - et) / D : 1, O = S ? -et : 0;
815
- S && $(d.current, {
816
- transition: `transform ${x.DURATION}s cubic-bezier(${x.EASE.join(",")})`,
817
- transform: C(c) ? `scale(${g}) translate3d(0, ${O}px, 0)` : `scale(${g}) translate3d(${O}px, 0, 0)`
818
- });
819
- }
820
- return r.useEffect(() => {
821
- F || window.requestAnimationFrame(() => {
822
- document.body.style.pointerEvents = "auto";
823
- });
824
- }, [
825
- F
826
- ]), /* @__PURE__ */ r.createElement(Ce, {
827
- defaultOpen: Y,
828
- onOpenChange: (s) => {
829
- !h && !s || (s ? K(!0) : ct(!0), W(s));
830
- },
831
- open: _
832
- }, /* @__PURE__ */ r.createElement(Yt.Provider, {
833
- value: {
834
- activeSnapPoint: ie,
835
- snapPoints: o,
836
- setActiveSnapPoint: kt,
837
- drawerRef: d,
838
- overlayRef: nt,
839
- onOpenChange: n,
840
- onPress: de,
841
- onRelease: pe,
842
- onDrag: fe,
843
- dismissible: h,
844
- shouldAnimate: Pt,
845
- handleOnly: f,
846
- isOpen: _,
847
- isDragging: G,
848
- shouldFade: Lt,
849
- closeDrawer: ct,
850
- onNestedDrag: he,
851
- onNestedOpenChange: we,
852
- onNestedRelease: ge,
853
- keyboardIsOpen: rt,
854
- modal: F,
855
- snapPointsOffset: ut,
856
- activeSnapPointIndex: at,
857
- direction: c,
858
- shouldScaleBackground: v,
859
- setBackgroundColorOnScale: w,
860
- noBodyStyles: A,
861
- container: N,
862
- autoFocus: j
863
- }
864
- }, e));
865
- }
866
- const ee = /* @__PURE__ */ r.forwardRef(function({ ...t }, n) {
867
- const { overlayRef: e, snapPoints: a, onRelease: i, shouldFade: o, isOpen: v, modal: w, shouldAnimate: T } = pt(), R = Kt(n, e), h = a && a.length > 0;
868
- if (!w)
869
- return null;
870
- const f = r.useCallback((m) => i(m), [
871
- i
872
- ]);
873
- return /* @__PURE__ */ r.createElement(Se, {
874
- onMouseUp: f,
875
- ref: R,
876
- "data-vaul-overlay": "",
877
- "data-vaul-snap-points": v && h ? "true" : "false",
878
- "data-vaul-snap-points-overlay": v && o ? "true" : "false",
879
- "data-vaul-animate": T?.current ? "true" : "false",
880
- ...t
881
- });
882
- });
883
- ee.displayName = "Drawer.Overlay";
884
- const ne = /* @__PURE__ */ r.forwardRef(function({ onPointerDownOutside: t, style: n, onOpenAutoFocus: e, ...a }, i) {
885
- const { drawerRef: o, onPress: v, onRelease: w, onDrag: T, keyboardIsOpen: R, snapPointsOffset: h, activeSnapPointIndex: f, modal: m, isOpen: B, direction: k, snapPoints: E, container: F, handleOnly: p, shouldAnimate: M, autoFocus: A } = pt(), [c, Y] = r.useState(!1), Z = Kt(i, o), u = r.useRef(null), b = r.useRef(null), y = r.useRef(!1), I = E && E.length > 0;
886
- Ge();
887
- const N = (l, U, _ = 0) => {
888
- if (y.current) return !0;
889
- const W = Math.abs(l.y), P = Math.abs(l.x), K = P > W, G = [
890
- "bottom",
891
- "right"
892
- ].includes(U) ? 1 : -1;
893
- if (U === "left" || U === "right") {
894
- if (!(l.x * G < 0) && P >= 0 && P <= _)
895
- return K;
896
- } else if (!(l.y * G < 0) && W >= 0 && W <= _)
897
- return !K;
898
- return y.current = !0, !0;
899
- };
900
- r.useEffect(() => {
901
- I && window.requestAnimationFrame(() => {
902
- Y(!0);
903
- });
904
- }, []);
905
- function j(l) {
906
- u.current = null, y.current = !1, w(l);
907
- }
908
- return /* @__PURE__ */ r.createElement(Te, {
909
- "data-vaul-drawer-direction": k,
910
- "data-vaul-drawer": "",
911
- "data-vaul-delayed-snap-points": c ? "true" : "false",
912
- "data-vaul-snap-points": B && I ? "true" : "false",
913
- "data-vaul-custom-container": F ? "true" : "false",
914
- "data-vaul-animate": M?.current ? "true" : "false",
915
- ...a,
916
- ref: Z,
917
- style: h && h.length > 0 ? {
918
- "--snap-point-height": `${h[f ?? 0]}px`,
919
- ...n
920
- } : n,
921
- onPointerDown: (l) => {
922
- p || (a.onPointerDown == null || a.onPointerDown.call(a, l), u.current = {
923
- x: l.pageX,
924
- y: l.pageY
925
- }, v(l));
926
- },
927
- onOpenAutoFocus: (l) => {
928
- e?.(l), A || l.preventDefault();
929
- },
930
- onPointerDownOutside: (l) => {
931
- if (t?.(l), !m || l.defaultPrevented) {
932
- l.preventDefault();
933
- return;
934
- }
935
- R.current && (R.current = !1);
936
- },
937
- onFocusOutside: (l) => {
938
- if (!m) {
939
- l.preventDefault();
940
- return;
941
- }
942
- },
943
- onPointerMove: (l) => {
944
- if (b.current = l, p || (a.onPointerMove == null || a.onPointerMove.call(a, l), !u.current)) return;
945
- const U = l.pageY - u.current.y, _ = l.pageX - u.current.x, W = l.pointerType === "touch" ? 10 : 2;
946
- N({
947
- x: _,
948
- y: U
949
- }, k, W) ? T(l) : (Math.abs(_) > W || Math.abs(U) > W) && (u.current = null);
950
- },
951
- onPointerUp: (l) => {
952
- a.onPointerUp == null || a.onPointerUp.call(a, l), u.current = null, y.current = !1, w(l);
953
- },
954
- onPointerOut: (l) => {
955
- a.onPointerOut == null || a.onPointerOut.call(a, l), j(b.current);
956
- },
957
- onContextMenu: (l) => {
958
- a.onContextMenu == null || a.onContextMenu.call(a, l), b.current && j(b.current);
959
- }
960
- });
961
- });
962
- ne.displayName = "Drawer.Content";
963
- const Ze = 250, tn = 120, en = /* @__PURE__ */ r.forwardRef(function({ preventCycle: t = !1, children: n, ...e }, a) {
964
- const { closeDrawer: i, isDragging: o, snapPoints: v, activeSnapPoint: w, setActiveSnapPoint: T, dismissible: R, handleOnly: h, isOpen: f, onPress: m, onDrag: B } = pt(), k = r.useRef(null), E = r.useRef(!1);
965
- function F() {
966
- if (E.current) {
967
- A();
968
- return;
969
- }
970
- window.setTimeout(() => {
971
- p();
972
- }, tn);
973
- }
974
- function p() {
975
- if (o || t || E.current) {
976
- A();
977
- return;
978
- }
979
- if (A(), !v || v.length === 0) {
980
- R || i();
981
- return;
982
- }
983
- if (w === v[v.length - 1] && R) {
984
- i();
985
- return;
986
- }
987
- const Y = v.findIndex((u) => u === w);
988
- if (Y === -1) return;
989
- const Z = v[Y + 1];
990
- T(Z);
991
- }
992
- function M() {
993
- k.current = window.setTimeout(() => {
994
- E.current = !0;
995
- }, Ze);
996
- }
997
- function A() {
998
- k.current && window.clearTimeout(k.current), E.current = !1;
999
- }
1000
- return /* @__PURE__ */ r.createElement("div", {
1001
- onClick: F,
1002
- onPointerCancel: A,
1003
- onPointerDown: (c) => {
1004
- h && m(c), M();
1005
- },
1006
- onPointerMove: (c) => {
1007
- h && B(c);
1008
- },
1009
- // onPointerUp is already handled by the content component
1010
- ref: a,
1011
- "data-vaul-drawer-visible": f ? "true" : "false",
1012
- "data-vaul-handle": "",
1013
- "aria-hidden": "true",
1014
- ...e
1015
- }, /* @__PURE__ */ r.createElement("span", {
1016
- "data-vaul-handle-hitarea": "",
1017
- "aria-hidden": "true"
1018
- }, n));
1019
- });
1020
- en.displayName = "Drawer.Handle";
1021
- function nn(t) {
1022
- const n = pt(), { container: e = n.container, ...a } = t;
1023
- return /* @__PURE__ */ r.createElement(Ee, {
1024
- container: e,
1025
- ...a
1026
- });
1027
- }
1028
- const V = {
1029
- Root: Qe,
1030
- Content: ne,
1031
- Overlay: ee,
1032
- Trigger: Oe,
1033
- Portal: nn,
1034
- Close: xe,
1035
- Title: De,
1036
- Description: Re
1037
- }, rn = ({ shouldScaleBackground: t = !0, ...n }) => /* @__PURE__ */ X.jsx(V.Root, { shouldScaleBackground: t, ...n });
1038
- rn.displayName = "Drawer";
1039
- const wn = V.Trigger, an = V.Portal, hn = V.Close, re = mt.forwardRef(({ className: t, ...n }, e) => /* @__PURE__ */ X.jsx(V.Overlay, { ref: e, className: ot("fixed inset-0 z-50 bg-black/80", t), ...n }));
1040
- re.displayName = V.Overlay.displayName;
1041
- const on = mt.forwardRef(({ className: t, children: n, ...e }, a) => /* @__PURE__ */ X.jsxs(an, { children: [
1042
- /* @__PURE__ */ X.jsx(re, {}),
1043
- /* @__PURE__ */ X.jsxs(
1044
- V.Content,
2
+ import { j as t } from "./jsx-runtime-tc70JA_2.mjs";
3
+ import * as l from "react";
4
+ import { Drawer as a } from "vaul";
5
+ import { c as o } from "./utils-B6yFEsav.mjs";
6
+ const n = ({ shouldScaleBackground: e = !0, ...r }) => /* @__PURE__ */ t.jsx(a.Root, { shouldScaleBackground: e, ...r });
7
+ n.displayName = "Drawer";
8
+ const u = a.Trigger, d = a.Portal, y = a.Close, i = l.forwardRef(({ className: e, ...r }, s) => /* @__PURE__ */ t.jsx(a.Overlay, { ref: s, className: o("fixed inset-0 z-50 bg-black/80", e), ...r }));
9
+ i.displayName = a.Overlay.displayName;
10
+ const c = l.forwardRef(({ className: e, children: r, ...s }, m) => /* @__PURE__ */ t.jsxs(d, { children: [
11
+ /* @__PURE__ */ t.jsx(i, {}),
12
+ /* @__PURE__ */ t.jsxs(
13
+ a.Content,
1045
14
  {
1046
- ref: a,
1047
- className: ot(
15
+ ref: m,
16
+ className: o(
1048
17
  "bg-background fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border",
1049
- t
18
+ e
1050
19
  ),
1051
- ...e,
20
+ ...s,
1052
21
  children: [
1053
- /* @__PURE__ */ X.jsx("div", { className: "bg-muted mx-auto mt-4 h-2 w-[100px] rounded-full" }),
1054
- n
22
+ /* @__PURE__ */ t.jsx("div", { className: "bg-muted mx-auto mt-4 h-2 w-[100px] rounded-full" }),
23
+ r
1055
24
  ]
1056
25
  }
1057
26
  )
1058
27
  ] }));
1059
- on.displayName = "DrawerContent";
1060
- const sn = ({ className: t, ...n }) => /* @__PURE__ */ X.jsx("div", { className: ot("grid gap-1.5 p-4 text-center sm:text-left", t), ...n });
1061
- sn.displayName = "DrawerHeader";
1062
- const ln = ({ className: t, ...n }) => /* @__PURE__ */ X.jsx("div", { className: ot("mt-auto flex flex-col gap-2 p-4", t), ...n });
1063
- ln.displayName = "DrawerFooter";
1064
- const un = mt.forwardRef(({ className: t, ...n }, e) => /* @__PURE__ */ X.jsx(
1065
- V.Title,
28
+ c.displayName = "DrawerContent";
29
+ const x = ({ className: e, ...r }) => /* @__PURE__ */ t.jsx("div", { className: o("grid gap-1.5 p-4 text-center sm:text-left", e), ...r });
30
+ x.displayName = "DrawerHeader";
31
+ const p = ({ className: e, ...r }) => /* @__PURE__ */ t.jsx("div", { className: o("mt-auto flex flex-col gap-2 p-4", e), ...r });
32
+ p.displayName = "DrawerFooter";
33
+ const f = l.forwardRef(({ className: e, ...r }, s) => /* @__PURE__ */ t.jsx(
34
+ a.Title,
1066
35
  {
1067
- ref: e,
1068
- className: ot("text-lg leading-none font-semibold tracking-tight", t),
1069
- ...n
36
+ ref: s,
37
+ className: o("text-lg leading-none font-semibold tracking-tight", e),
38
+ ...r
1070
39
  }
1071
40
  ));
1072
- un.displayName = V.Title.displayName;
1073
- const cn = mt.forwardRef(({ className: t, ...n }, e) => /* @__PURE__ */ X.jsx(V.Description, { ref: e, className: ot("text-muted-foreground text-sm", t), ...n }));
1074
- cn.displayName = V.Description.displayName;
41
+ f.displayName = a.Title.displayName;
42
+ const w = l.forwardRef(({ className: e, ...r }, s) => /* @__PURE__ */ t.jsx(a.Description, { ref: s, className: o("text-muted-foreground text-sm", e), ...r }));
43
+ w.displayName = a.Description.displayName;
1075
44
  export {
1076
- rn as Drawer,
1077
- hn as DrawerClose,
1078
- on as DrawerContent,
1079
- cn as DrawerDescription,
1080
- ln as DrawerFooter,
1081
- sn as DrawerHeader,
1082
- re as DrawerOverlay,
1083
- an as DrawerPortal,
1084
- un as DrawerTitle,
1085
- wn as DrawerTrigger
45
+ n as Drawer,
46
+ y as DrawerClose,
47
+ c as DrawerContent,
48
+ w as DrawerDescription,
49
+ p as DrawerFooter,
50
+ x as DrawerHeader,
51
+ i as DrawerOverlay,
52
+ d as DrawerPortal,
53
+ f as DrawerTitle,
54
+ u as DrawerTrigger
1086
55
  };