@pieai/swimmer-ui-kit 2.8.0 → 2.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,1205 @@
1
+ import { _ as e, c as t, d as n, h as r, i, m as a, n as o, t as s } from "./reducedMotion-C7O9ls34.js";
2
+ import { useEffect as c, useId as l, useLayoutEffect as u, useRef as d, useState as f } from "react";
3
+ import { createPortal as p } from "react-dom";
4
+ import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
5
+ import { FloatingPortal as _, autoUpdate as v, computePosition as y, flip as b, hide as x, offset as S, shift as C, size as w } from "@floating-ui/react";
6
+ function T(e, t, n) {
7
+ return Number.isFinite(e) ? Math.max(t, Math.min(n, e)) : t;
8
+ }
9
+ function E(e) {
10
+ return !!(e && [
11
+ e.x,
12
+ e.y,
13
+ e.width,
14
+ e.height
15
+ ].every(Number.isFinite) && e.width > 0 && e.height > 0);
16
+ }
17
+ function D(e, t) {
18
+ return E(e) && e.x + e.width > t.x && e.y + e.height > t.y && e.x < t.x + t.width && e.y < t.y + t.height;
19
+ }
20
+ function O(e) {
21
+ return {
22
+ x: e.x + e.width / 2,
23
+ y: e.y + e.height / 2
24
+ };
25
+ }
26
+ function k(e, t) {
27
+ let n = Math.hypot(t.x - e.x, t.y - e.y) || 1;
28
+ return {
29
+ x: (t.x - e.x) / n,
30
+ y: (t.y - e.y) / n
31
+ };
32
+ }
33
+ function A(e, t) {
34
+ let n = Math.max(e.x, t.x), r = Math.max(e.y, t.y);
35
+ return {
36
+ x: n,
37
+ y: r,
38
+ width: Math.max(0, Math.min(e.x + e.width, t.x + t.width) - n),
39
+ height: Math.max(0, Math.min(e.y + e.height, t.y + t.height) - r)
40
+ };
41
+ }
42
+ function ee(e, t) {
43
+ let n = e.y + e.height + 88 < t.y + t.height, r = n ? "bottom" : "top", i = Math.max(t.x + 18, e.x), a = Math.min(t.x + t.width - 18, e.x + e.width), o = T(Math.max(0, a - i) * .58, 36, 84);
44
+ return {
45
+ x: T((i + a) / 2, t.x + o / 2 + 8, t.x + t.width - o / 2 - 8),
46
+ y: T(n ? e.y + e.height + 10 : e.y - 10, t.y + 18, t.y + t.height - 18),
47
+ side: r,
48
+ width: o
49
+ };
50
+ }
51
+ function j(e, t, n, r) {
52
+ let i = T(n, 0, 1), a = k(e, t), o = Math.min(86, Math.hypot(t.x - e.x, t.y - e.y) * .2), s = {
53
+ x: T((e.x + t.x) / 2 + a.y * o, r.x + 16, r.x + r.width - 16),
54
+ y: T((e.y + t.y) / 2 - a.x * o, r.y + 16, r.y + r.height - 16)
55
+ }, c = 2 * (1 - i) * (s.x - e.x) + 2 * i * (t.x - s.x), l = 2 * (1 - i) * (s.y - e.y) + 2 * i * (t.y - s.y);
56
+ return {
57
+ x: (1 - i) ** 2 * e.x + 2 * (1 - i) * i * s.x + i ** 2 * t.x,
58
+ y: (1 - i) ** 2 * e.y + 2 * (1 - i) * i * s.y + i ** 2 * t.y,
59
+ angle: Math.atan2(l, c) * 180 / Math.PI
60
+ };
61
+ }
62
+ function M(e = 0, t = 0, n = 0, r = 1, a = 0) {
63
+ let o = T(a, 0, 1), s = 66 * Math.sqrt(1 - .075 * T(n, 0, 1)) - o * 2.4;
64
+ return i(80 - s, 80 - s, s * 2, s * 2, [
65
+ s,
66
+ s,
67
+ s,
68
+ s
69
+ ], {
70
+ amplitude: (3.5 + o * 9 + T(t, 0, 1) * 9) * T(r, .15, 1.25),
71
+ lobes: 3,
72
+ seed: 17,
73
+ phase: e
74
+ });
75
+ }
76
+ function N(e, t, n = 20) {
77
+ let r = T(t, 0, 1), a = T(n, 6, 48), o = a + (e - a) * r, s = a + (8 - a) * r;
78
+ return i(-o / 2, -s / 2, o, s, [
79
+ s / 2,
80
+ s / 2,
81
+ s / 2,
82
+ s / 2
83
+ ], {
84
+ amplitude: 2.2,
85
+ phase: r * Math.PI,
86
+ seed: 17,
87
+ lobes: 3
88
+ });
89
+ }
90
+ //#endregion
91
+ //#region src/liquidAmbientClock.ts
92
+ var P = /* @__PURE__ */ new Map(), F, I, L = !1;
93
+ function R() {
94
+ if (L || I !== void 0 || (clearTimeout(F), F = void 0, !P.size)) return;
95
+ let e = Math.min(...[...P.values()].map((e) => e.at));
96
+ F = setTimeout(() => {
97
+ F = void 0, I = requestAnimationFrame((e) => {
98
+ I = void 0, L = !0;
99
+ try {
100
+ for (let [t, n] of [...P]) n.at > e + 1 || !P.has(t) || (P.delete(t), n.paint(e));
101
+ } finally {
102
+ L = !1, R();
103
+ }
104
+ });
105
+ }, Math.max(0, e - performance.now()));
106
+ }
107
+ function te(e, t = 1e3 / 12) {
108
+ let n = Symbol();
109
+ return P.set(n, {
110
+ at: performance.now() + t,
111
+ paint: e
112
+ }), R(), () => {
113
+ P.delete(n), !P.size && I !== void 0 && (cancelAnimationFrame(I), I = void 0), R();
114
+ };
115
+ }
116
+ //#endregion
117
+ //#region src/liquidPresenceMotion.ts
118
+ var z = o("cubic-bezier(0.45, 0, 0.2, 1)");
119
+ function ne(e) {
120
+ let { source: t, destination: n, viewport: r, returning: i = !1, from: a, origin: o } = e, s = o?.seat == null ? 0 : 180;
121
+ if (s && e.elapsed < s) return {
122
+ ...o,
123
+ phase: "gather",
124
+ seat: o.seat * (1 - z(T(e.elapsed / s, 0, 1)))
125
+ };
126
+ let c = Math.max(0, e.elapsed - s), l = O(t), u = k(l, n), d = Math.atan2(u.y, u.x) * 180 / Math.PI, f = t.width / 160, p = {
127
+ x: l.x + u.x * 112 * f,
128
+ y: l.y + u.y * 112 * f
129
+ }, m = {
130
+ phase: "still",
131
+ point: l,
132
+ angle: d,
133
+ diameter: 16 * f * 2,
134
+ stretch: 1,
135
+ separation: 0,
136
+ bud: null,
137
+ seat: null
138
+ };
139
+ if (i) {
140
+ if (o?.bud) {
141
+ let e = z(T(c / 320, 0, 1)), t = o.bud.x + (80 - o.bud.x) * e, n = o.bud.y + (80 - o.bud.y) * e;
142
+ return {
143
+ ...m,
144
+ phase: e < 1 ? "merge" : "still",
145
+ separation: o.separation * (1 - e),
146
+ point: {
147
+ x: l.x + (t - 80) * f,
148
+ y: l.y + (n - 80) * f
149
+ },
150
+ bud: e < 1 ? {
151
+ x: t,
152
+ y: n,
153
+ radius: o.bud.radius * (1 - e)
154
+ } : null
155
+ };
156
+ }
157
+ let e = T(c / 620, 0, 1);
158
+ if (e < 1) {
159
+ let t = j(a ?? n, p, z(e), r);
160
+ return {
161
+ ...m,
162
+ phase: "return",
163
+ separation: 1,
164
+ angle: t.angle,
165
+ point: t,
166
+ stretch: 1 + .3 * Math.sin(e * Math.PI)
167
+ };
168
+ }
169
+ let t = T((c - 620) / 420, 0, 1), i = 112 - 78 * z(t);
170
+ return {
171
+ ...m,
172
+ phase: t < 1 ? "merge" : "still",
173
+ separation: 1 - z(t),
174
+ point: {
175
+ x: l.x + u.x * i * f,
176
+ y: l.y + u.y * i * f
177
+ },
178
+ bud: t < 1 ? {
179
+ x: 80 + u.x * i,
180
+ y: 80 + u.y * i,
181
+ radius: 16 * (1 - .65 * z(t))
182
+ } : null
183
+ };
184
+ }
185
+ let h = o?.phase === "split" ? o.bud : null, g = h ? o.separation : 0, _ = h ? Math.max(180, 460 * (1 - g)) : a ? 0 : 460;
186
+ if (c < _) {
187
+ let e = z(c / _), t = 42 + 70 * e, n = h ? h.x + (80 + u.x * 112 - h.x) * e : 80 + u.x * t, r = h ? h.y + (80 + u.y * 112 - h.y) * e : 80 + u.y * t, i = h?.radius ?? 16 * .55;
188
+ return {
189
+ ...m,
190
+ phase: "split",
191
+ separation: g + (1 - g) * e,
192
+ point: {
193
+ x: l.x + (n - 80) * f,
194
+ y: l.y + (r - 80) * f
195
+ },
196
+ bud: {
197
+ x: n,
198
+ y: r,
199
+ radius: i + (16 - i) * e
200
+ }
201
+ };
202
+ }
203
+ let v = a ?? p, y = 560 + Math.min(260, Math.hypot(n.x - v.x, n.y - v.y) * .26), b = T((c - _) / y, 0, 1);
204
+ if (b < 1) {
205
+ let e = j(v, n, z(b), r);
206
+ return {
207
+ ...m,
208
+ phase: "flight",
209
+ separation: 1,
210
+ point: e,
211
+ angle: e.angle,
212
+ stretch: 1 + .35 * Math.sin(b * Math.PI)
213
+ };
214
+ }
215
+ let x = T((c - _ - y) / 380, 0, 1);
216
+ return {
217
+ ...m,
218
+ phase: x < 1 ? "land" : "dock",
219
+ separation: 1,
220
+ point: n,
221
+ seat: z(x)
222
+ };
223
+ }
224
+ //#endregion
225
+ //#region src/liquidPresencePaint.ts
226
+ function B(e, t) {
227
+ e.toggleAttribute("hidden", !t);
228
+ let n = e.style, r = t ? "" : "none";
229
+ n.display !== r && (n.display = r);
230
+ }
231
+ var V = (e, t, n) => {
232
+ let r = String(n);
233
+ e.getAttribute(t) !== r && e.setAttribute(t, r);
234
+ };
235
+ function H(e, t, n) {
236
+ let r = e.overlay.getBoundingClientRect(), i = r.width / (e.overlay.clientWidth || r.width || 1) || 1, a = r.height / (e.overlay.clientHeight || r.height || 1) || 1;
237
+ return {
238
+ x: (t - r.x) / i,
239
+ y: (n - r.y) / a
240
+ };
241
+ }
242
+ function re(e, t, n, r, i = 0, a = 1, o = !1, s = 0) {
243
+ V(e.source, "data-liquid-phase", t.phase), V(e.overlay, "data-liquid-phase", t.phase), V(e.body, "d", M(r, i, t.separation, a, s));
244
+ let c = t.bud ? Math.sin(t.separation * Math.PI) * .045 : 0;
245
+ V(e.body, "transform", `translate(${((t.bud?.x ?? 80) - 80) * c} ${((t.bud?.y ?? 80) - 80) * c})`), B(e.bud, !!t.bud), t.bud && (V(e.bud, "cx", t.bud.x), V(e.bud, "cy", t.bud.y), V(e.bud, "r", t.bud.radius));
246
+ let l = t.phase === "flight" || t.phase === "return";
247
+ B(e.flight, l);
248
+ let u = H(e, t.point.x, t.point.y);
249
+ if (l) {
250
+ let n = t.diameter / 32;
251
+ e.flight.style.transform = `translate(${u.x - 48}px, ${u.y - 36}px)`, V(e.flightBody, "transform", `rotate(${t.angle}) scale(${n * t.stretch} ${n / Math.sqrt(t.stretch)})`), V(e.trail, "opacity", Math.min(.8, (t.stretch - 1) * 3));
252
+ }
253
+ B(e.seat, t.seat !== null), t.seat !== null && (e.seat.style.transform = `translate(${u.x - 56}px, ${u.y - 28}px)`, V(e.seatBody, "d", N(t.seatWidth ?? n, t.seat, t.diameter))), B(e.label, o || t.phase !== "gather" && t.seat !== null && t.seat > .45);
254
+ }
255
+ function ie(e, t, n, r) {
256
+ e.satellites.forEach((e, i) => {
257
+ if (B(e, n), !n) return;
258
+ let a = t * .7 + i * Math.PI * 2 / 3, o = 63 + Math.max(0, Math.sin(t * 1.6 + i * 2)) * (16 + r * 12);
259
+ V(e, "cx", 80 + Math.cos(a) * o), V(e, "cy", 80 + Math.sin(a) * o), V(e, "r", 7 + i * 1.5);
260
+ });
261
+ }
262
+ function U() {
263
+ let e = window.visualViewport;
264
+ return {
265
+ x: e?.offsetLeft ?? 0,
266
+ y: e?.offsetTop ?? 0,
267
+ width: e?.width ?? innerWidth,
268
+ height: e?.height ?? innerHeight
269
+ };
270
+ }
271
+ //#endregion
272
+ //#region src/liquidPresenceTracking.ts
273
+ function ae(e) {
274
+ try {
275
+ let t = e.contextElement;
276
+ if (t && t.ownerDocument !== document || t && (!t.isConnected || t.closest("[hidden], [inert]")) || t && getComputedStyle(t).visibility === "hidden") return null;
277
+ let n = document.querySelector("dialog:modal");
278
+ if (n && (!t || !n.contains(t))) return null;
279
+ let r = e.getRect();
280
+ return E(r) && D(r, U()) ? r : null;
281
+ } catch {
282
+ return null;
283
+ }
284
+ }
285
+ function oe(e, t, n, r) {
286
+ let i = t.contextElement, a = {
287
+ ...i ? { contextElement: i } : {},
288
+ getBoundingClientRect: () => {
289
+ let e = ae(t) ?? {
290
+ x: 0,
291
+ y: 0,
292
+ width: 0,
293
+ height: 0
294
+ };
295
+ return {
296
+ ...e,
297
+ top: e.y,
298
+ left: e.x,
299
+ right: e.x + e.width,
300
+ bottom: e.y + e.height
301
+ };
302
+ }
303
+ }, o = /* @__PURE__ */ new Set();
304
+ for (let t of [e, i]) for (let e = t; e; e = e.parentElement) o.add(e);
305
+ let s = new MutationObserver(r);
306
+ for (let e of o) s.observe(e, {
307
+ attributes: !0,
308
+ attributeFilter: [
309
+ "style",
310
+ "class",
311
+ "hidden",
312
+ "inert",
313
+ "open"
314
+ ]
315
+ });
316
+ let c = new MutationObserver((t) => {
317
+ (!e.isConnected || i && !i.isConnected || t.some((e) => e.type === "attributes" || [...e.addedNodes, ...e.removedNodes].some((e) => e instanceof Element && (e.matches("dialog") || !!e.querySelector("dialog"))))) && r();
318
+ });
319
+ c.observe(document.body, {
320
+ subtree: !0,
321
+ childList: !0,
322
+ attributes: !0,
323
+ attributeFilter: ["open", "inert"]
324
+ });
325
+ let l = () => {}, u = !1, d = /* @__PURE__ */ new Map(), f = (e) => {
326
+ l(), u = e, l = v(i ?? a, n, r, { animationFrame: !i || e });
327
+ }, p = (e) => {
328
+ if (!(e.target instanceof Element) || !o.has(e.target)) return;
329
+ let t = "propertyName" in e ? String(e.propertyName) : "animationName" in e ? String(e.animationName) : e.type, n = d.get(e.target) ?? /* @__PURE__ */ new Set();
330
+ e.type === "transitionrun" || e.type === "animationstart" ? n.add(t) : n.delete(t), n.size ? d.set(e.target, n) : d.delete(e.target), u !== !!d.size && f(!!d.size), r();
331
+ }, m = [
332
+ "transitionrun",
333
+ "transitionend",
334
+ "transitioncancel",
335
+ "animationstart",
336
+ "animationend",
337
+ "animationcancel"
338
+ ];
339
+ for (let e of m) document.addEventListener(e, p, !0);
340
+ return f(!1), () => {
341
+ l(), s.disconnect(), c.disconnect();
342
+ for (let e of m) document.removeEventListener(e, p, !0);
343
+ };
344
+ }
345
+ //#endregion
346
+ //#region src/useLiquidPresenceMotion.ts
347
+ function W(t, n, i, o) {
348
+ let s = d(i);
349
+ s.current = i;
350
+ let l = !!i.guideContent, u = d(null), f = d(null), p = d(null), m = d(0), h = d(+(i.idleMotion === "breathe")), g = d(() => {});
351
+ c(() => {
352
+ let i = t.current, o = n.current;
353
+ if (!i || !o) return;
354
+ let c = {
355
+ source: i,
356
+ overlay: o,
357
+ body: i.querySelector("[data-presence-body]"),
358
+ bud: i.querySelector("[data-presence-bud]"),
359
+ satellites: [...i.querySelectorAll("[data-presence-satellite]")],
360
+ flight: o.querySelector(".game-ui-liquid-presence-flight"),
361
+ flightBody: o.querySelector("[data-presence-flight-body]"),
362
+ trail: o.querySelector("[data-presence-trail]"),
363
+ seat: o.querySelector(".game-ui-liquid-presence-seat"),
364
+ seatBody: o.querySelector("[data-presence-seat-body]"),
365
+ label: o.querySelector(".game-ui-liquid-presence-label")
366
+ }, l = s.current.target ?? null;
367
+ l || (f.current = null), l?.key === f.current && (l = null);
368
+ let d = u.current, _ = !l && !!(d && d.phase !== "still"), v = d && [
369
+ "flight",
370
+ "dock",
371
+ "land",
372
+ "gather",
373
+ "return"
374
+ ].includes(d.phase) ? d.point : void 0, x = d?.point ?? O(i.getBoundingClientRect()), E = d?.seatWidth ?? 48, k = d ?? void 0, j = i.getBoundingClientRect(), M = performance.now(), N = null, P = () => {}, F = !0, I = !1, L = !1, R = !0, z = 0, V = m.current, H = performance.now(), W = 0, G = 0, K = null, q = () => {}, J, Y = () => {
375
+ I && r(), I = !1;
376
+ }, X = (e) => {
377
+ if (l) {
378
+ f.current = l.key, l = null, _ = !!(u.current && u.current.phase !== "still"), k = u.current ?? void 0, v = u.current?.point, x = v ?? x, M = performance.now(), q(), clearTimeout(J), G++, B(c.label, !1);
379
+ try {
380
+ s.current.onDismiss?.(e);
381
+ } catch {}
382
+ $();
383
+ }
384
+ }, se = () => {
385
+ if (!l) return null;
386
+ let e = c.label.style.pointerEvents;
387
+ s.current.guideContent && (c.label.style.pointerEvents = "none");
388
+ try {
389
+ return ae(s.current.target?.key === l.key ? s.current.target : l);
390
+ } finally {
391
+ c.label.style.pointerEvents = e;
392
+ }
393
+ }, Z = () => {
394
+ if (!l) return;
395
+ let e = se();
396
+ if (!e) {
397
+ X("unavailable");
398
+ return;
399
+ }
400
+ let t = ee(e, U()), n = A(e, U()), r = (e) => T(e === "top" ? n.y - 10 : n.y + n.height + 10, U().y + 18, U().y + U().height - 18);
401
+ x = {
402
+ x: t.x,
403
+ y: r(K ?? t.side)
404
+ }, E = t.width;
405
+ let i = {
406
+ ...l.contextElement ? { contextElement: l.contextElement } : {},
407
+ getBoundingClientRect: () => ({
408
+ ...n,
409
+ top: n.y,
410
+ left: n.x,
411
+ bottom: n.y + n.height,
412
+ right: n.x + n.width
413
+ })
414
+ }, a = ++G, o = s.current.guideSize === "expanded";
415
+ o || (c.label.style.maxHeight = ""), s.current.guideContent && !c.label.style.transform && (c.label.style.visibility = "hidden", B(c.label, !0)), y(i, c.label, {
416
+ strategy: "absolute",
417
+ placement: o && U().width >= 900 ? "right" : t.side,
418
+ middleware: [
419
+ S(26),
420
+ b({
421
+ padding: 16,
422
+ ...o && U().width >= 900 ? { fallbackPlacements: [
423
+ "left",
424
+ "bottom",
425
+ "top"
426
+ ] } : {}
427
+ }),
428
+ C({
429
+ padding: 16,
430
+ crossAxis: !o
431
+ }),
432
+ ...o ? [w({
433
+ padding: 16,
434
+ apply({ availableHeight: e, elements: t }) {
435
+ let n = `${Math.max(0, Math.min(560, U().height * .65, e))}px`;
436
+ t.floating.style.maxHeight !== n && (t.floating.style.maxHeight = n);
437
+ }
438
+ })] : []
439
+ ]
440
+ }).then(({ x: e, y: n, placement: i }) => {
441
+ if (F && a === G) {
442
+ c.label.style.transform = `translate(${e}px, ${n}px)`, c.label.style.visibility = "", K = i.startsWith("top") ? "top" : i.startsWith("bottom") ? "bottom" : t.side;
443
+ let a = r(K);
444
+ x.y !== a && (x = {
445
+ x: t.x,
446
+ y: a
447
+ }, $());
448
+ }
449
+ }).catch(() => {});
450
+ }, Q = () => [
451
+ "connecting",
452
+ "listening",
453
+ "thinking",
454
+ "speaking",
455
+ "working"
456
+ ].includes(s.current.activity ?? "idle"), ce = () => s.current.idleMotion === "breathe" && (s.current.activity ?? "idle") === "idle", le = () => {
457
+ if (L = !1, s.current.reducedMotion || s.current.activity === "disabled" || document.hidden || !R || !D(i.getBoundingClientRect(), U())) return !1;
458
+ let t = document.querySelector("dialog:modal");
459
+ if (t && !t.contains(i)) return !1;
460
+ let n = l?.contextElement?.closest("dialog") ?? null;
461
+ if (l && i.closest("dialog") !== n) return !1;
462
+ let r = 13184 + (i.getBoundingClientRect().width * 2) ** 2, o = a();
463
+ return o.maxAnimatedGroups === 0 || r > o.maxFilterArea ? (Y(), !1) : !(l || _ || Q()) && ce() && !I && o.activeGroups > 0 ? (L = !0, !1) : (I ||= e(r), I);
464
+ };
465
+ function ue(e) {
466
+ if (!F || document.hidden) return;
467
+ let t = c.source.getBoundingClientRect();
468
+ if (!c.source.isConnected || c.source.closest("[hidden], [inert]") || t.width <= 0 || t.height <= 0) {
469
+ _ = !1, u.current = null, X("unavailable"), B(c.label, !1), B(c.flight, !1), B(c.seat, !1), Y();
470
+ return;
471
+ }
472
+ if (l && !se()) {
473
+ X("unavailable");
474
+ return;
475
+ }
476
+ let n = le(), r = ne({
477
+ elapsed: e - M,
478
+ source: _ ? t : j,
479
+ destination: x,
480
+ viewport: U(),
481
+ returning: _,
482
+ ...v ? { from: v } : {},
483
+ ...k ? { origin: k } : {}
484
+ });
485
+ !l && !_ && (r = {
486
+ ...r,
487
+ phase: "still",
488
+ separation: 0,
489
+ bud: null,
490
+ seat: null
491
+ }), (!n || l && p.current === l.key) && (r = {
492
+ ...r,
493
+ phase: l ? "dock" : "still",
494
+ point: x,
495
+ bud: null,
496
+ seat: l ? 1 : null,
497
+ separation: +!!l
498
+ }), _ && r.phase === "still" && (_ = !1), l && r.phase === "dock" && (p.current = l.key);
499
+ let i = !["still", "dock"].includes(r.phase), a = s.current.levelRef?.current, o = !i && ce(), d = Math.max(0, Math.min(160, e - H));
500
+ H = e;
501
+ let f = typeof a == "number" ? T(a, 0, 1) : 0;
502
+ W += (f - W) * (1 - Math.exp(-d / (f > W ? 65 : 140)));
503
+ let g = T(s.current.motionSpeed ?? 1, .5, 1.5), y = T(s.current.motionIntensity ?? 1, .25, 1.25);
504
+ n && (i || Q() || o) && (V += d * (o ? 84e-5 : .00105) * g), m.current = V, n && (i || Q() || o) && (h.current += (+!!o - h.current) * (1 - Math.exp(-d / 500)));
505
+ let b = n && Q() && !i ? .14 + W * .75 : i ? .2 : 0, S = c.label.hasAttribute("hidden");
506
+ re(c, r, E, V, b, y, !!(s.current.guideContent && l), h.current), ie(c, V, n && s.current.splashes !== !1 && s.current.activity === "speaking" && r.phase === "still", W);
507
+ let C = n && (i || Q()) ? "animated" : n && o ? "ambient" : "static";
508
+ c.source.dataset.liquidMotion !== C && (c.source.dataset.liquidMotion = C), u.current = {
509
+ ...r,
510
+ seatWidth: r.phase === "gather" ? k?.seatWidth ?? E : E
511
+ }, l && S && !c.label.hasAttribute("hidden") && Z(), n && (i || Q()) ? N = requestAnimationFrame(de) : (Y(), o && (n || L) && (P = te(() => {
512
+ P = () => {}, F && !document.hidden && R && de(performance.now());
513
+ }, L ? 250 : 1e3 / 12)));
514
+ }
515
+ function de(e) {
516
+ if (N = null, !F || document.hidden) {
517
+ Y();
518
+ return;
519
+ }
520
+ if ((u.current?.phase === "still" || u.current?.phase === "dock") && e - z < 32) {
521
+ N = requestAnimationFrame(de);
522
+ return;
523
+ }
524
+ z = e, ue(e);
525
+ }
526
+ function $() {
527
+ !F || N !== null || document.hidden || (P(), P = () => {}, ue(performance.now()));
528
+ }
529
+ g.current = $;
530
+ let fe = () => {
531
+ if (q(), q = () => {}, !l || document.hidden) return;
532
+ let e = oe(c.source, l, c.label, () => {
533
+ Z(), $();
534
+ });
535
+ q = e, l || e();
536
+ };
537
+ l && (Z(), l && (fe(), l && !s.current.guideContent && (J = setTimeout(() => X("expired"), 12e3))));
538
+ let pe = (e) => {
539
+ if (e.key === "Escape" && !e.isComposing && l) {
540
+ if (s.current.guideContent && e.target instanceof Node && c.label.contains(e.target)) return;
541
+ let t = document.querySelector("dialog:modal");
542
+ if (t && !t.contains(c.label)) return;
543
+ s.current.guideContent && e.preventDefault(), X("dismissed");
544
+ }
545
+ }, me = (e) => {
546
+ s.current.dismissOnTargetClick !== !1 && l?.contextElement && e.target instanceof Node && l.contextElement.contains(e.target) && X("dismissed");
547
+ }, he = () => {
548
+ document.hidden ? (P(), P = () => {}, N !== null && cancelAnimationFrame(N), N = null, q(), G++, Y()) : (H = performance.now(), fe(), $());
549
+ }, ge = typeof IntersectionObserver > "u" ? null : new IntersectionObserver((e) => {
550
+ R = e[0]?.isIntersecting ?? !0, R || (P(), P = () => {}, N !== null && cancelAnimationFrame(N), N = null, Y()), $();
551
+ });
552
+ return ge?.observe(i), document.addEventListener("keydown", pe, !0), document.addEventListener("click", me), document.addEventListener("visibilitychange", he), document.addEventListener("close", $, !0), document.addEventListener("toggle", $, !0), $(), () => {
553
+ F = !1, g.current = () => {}, G++, N !== null && cancelAnimationFrame(N), clearTimeout(J), P(), q(), ge?.disconnect(), Y(), document.removeEventListener("keydown", pe, !0), document.removeEventListener("click", me), document.removeEventListener("visibilitychange", he), document.removeEventListener("close", $, !0), document.removeEventListener("toggle", $, !0);
554
+ };
555
+ }, [
556
+ t,
557
+ n,
558
+ o,
559
+ i.target?.key,
560
+ i.reducedMotion,
561
+ i.size,
562
+ i.guideSize,
563
+ l
564
+ ]), c(() => g.current(), [
565
+ i.activity,
566
+ i.idleMotion,
567
+ i.motionSpeed,
568
+ i.motionIntensity,
569
+ i.splashes
570
+ ]);
571
+ }
572
+ //#endregion
573
+ //#region src/LiquidPresence.tsx
574
+ function G(e) {
575
+ let t = s() || e.reducedMotion === !0, r = T(e.size ?? 64, 32, 224), i = `presence-${l().replace(/[^a-zA-Z0-9_-]/g, "")}`, a = d(null), o = d(null), [u, _] = f(null);
576
+ c(() => {
577
+ let t = e.target?.contextElement?.closest("dialog");
578
+ _(t ?? a.current?.closest("dialog") ?? document.body);
579
+ }, [e.target?.contextElement]), c(() => {
580
+ let e = a.current, t = o.current;
581
+ if (!e || !t) return;
582
+ let n = [
583
+ "--liquid-presence-from",
584
+ "--liquid-presence-to",
585
+ "--game-ui-secondary",
586
+ "--game-ui-warning",
587
+ "--game-ui-panel-strong",
588
+ "--game-ui-text",
589
+ "--game-ui-font-body",
590
+ "--game-ui-radius-control",
591
+ "--game-ui-shadow-button",
592
+ "--game-ui-surface-raised",
593
+ "--game-ui-text-muted",
594
+ "--game-ui-border-subtle",
595
+ "--game-ui-border-ink",
596
+ "--game-ui-disabled",
597
+ "--game-ui-button-lip-ink",
598
+ "--game-ui-accent",
599
+ "--game-ui-accent-bright",
600
+ "--game-ui-accent-contrast"
601
+ ], r = () => {
602
+ let r = getComputedStyle(e);
603
+ for (let e of n) {
604
+ let n = r.getPropertyValue(e).trim();
605
+ t.style.getPropertyValue(e) !== n && t.style.setProperty(e, n);
606
+ }
607
+ }, i = new MutationObserver(r);
608
+ for (let t = e; t; t = t.parentElement) i.observe(t, {
609
+ attributes: !0,
610
+ attributeFilter: [
611
+ "class",
612
+ "style",
613
+ "data-game-ui-theme",
614
+ "data-activity"
615
+ ]
616
+ });
617
+ return r(), window.addEventListener("resize", r, { passive: !0 }), () => {
618
+ i.disconnect(), window.removeEventListener("resize", r);
619
+ };
620
+ }, [u]), W(a, o, {
621
+ ...e,
622
+ size: r,
623
+ reducedMotion: t
624
+ }, u);
625
+ let v = {
626
+ width: r,
627
+ height: r,
628
+ ...e.colorFrom ? { "--liquid-presence-from": e.colorFrom } : {},
629
+ ...e.colorTo ? { "--liquid-presence-to": e.colorTo } : {},
630
+ ...["error", "unknown"].includes(e.activity ?? "") ? {
631
+ "--liquid-presence-from": "var(--game-ui-warning)",
632
+ "--liquid-presence-to": "var(--game-ui-warning)"
633
+ } : {}
634
+ }, y = (e, t) => /* @__PURE__ */ g("defs", { children: [/* @__PURE__ */ g("linearGradient", {
635
+ id: `${i}-${e}-fill`,
636
+ gradientUnits: "userSpaceOnUse",
637
+ x1: e === "core" ? 24 : -24,
638
+ y1: e === "core" ? 16 : -18,
639
+ x2: e === "core" ? 136 : 24,
640
+ y2: e === "core" ? 146 : 18,
641
+ children: [/* @__PURE__ */ h("stop", {
642
+ offset: "0",
643
+ stopColor: "var(--liquid-presence-from, var(--game-ui-secondary))"
644
+ }), /* @__PURE__ */ h("stop", {
645
+ offset: "1",
646
+ stopColor: "var(--liquid-presence-to, var(--game-ui-secondary))"
647
+ })]
648
+ }), /* @__PURE__ */ h("filter", {
649
+ id: `${i}-${e}-goo`,
650
+ filterUnits: "userSpaceOnUse",
651
+ ...t,
652
+ colorInterpolationFilters: "sRGB",
653
+ children: /* @__PURE__ */ h(n, {
654
+ blur: e === "core" ? 5 : 2,
655
+ contrast: 18,
656
+ gloss: 3.5,
657
+ shadows: [],
658
+ stroke: null,
659
+ waviness: 0
660
+ })
661
+ })] });
662
+ return /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h("span", {
663
+ ref: a,
664
+ className: `game-ui-liquid-presence ${e.className ?? ""}`,
665
+ style: v,
666
+ "data-activity": e.activity ?? "idle",
667
+ "aria-hidden": "true",
668
+ children: /* @__PURE__ */ g("svg", {
669
+ viewBox: "0 0 160 160",
670
+ focusable: "false",
671
+ children: [y("core", {
672
+ x: -80,
673
+ y: -80,
674
+ width: 320,
675
+ height: 320
676
+ }), /* @__PURE__ */ g("g", {
677
+ fill: `url(#${i}-core-fill)`,
678
+ filter: `url(#${i}-core-goo)`,
679
+ children: [
680
+ /* @__PURE__ */ h("path", {
681
+ "data-presence-body": "",
682
+ d: M()
683
+ }),
684
+ /* @__PURE__ */ h("circle", {
685
+ "data-presence-bud": "",
686
+ cx: "80",
687
+ cy: "80",
688
+ r: "0",
689
+ style: { display: "none" }
690
+ }),
691
+ [
692
+ 0,
693
+ 1,
694
+ 2
695
+ ].map((e) => /* @__PURE__ */ h("circle", {
696
+ "data-presence-satellite": "",
697
+ cx: "80",
698
+ cy: "80",
699
+ r: "0",
700
+ style: { display: "none" }
701
+ }, e))
702
+ ]
703
+ })]
704
+ })
705
+ }), u && p(/* @__PURE__ */ g("div", {
706
+ ref: o,
707
+ className: "game-ui-liquid-presence-overlay",
708
+ style: {
709
+ ...v,
710
+ width: void 0,
711
+ height: void 0
712
+ },
713
+ "data-presence-overlay": "",
714
+ children: [
715
+ /* @__PURE__ */ g("svg", {
716
+ className: "game-ui-liquid-presence-flight",
717
+ viewBox: "-48 -36 96 72",
718
+ "aria-hidden": "true",
719
+ focusable: "false",
720
+ style: { display: "none" },
721
+ children: [y("flight", {
722
+ x: -48,
723
+ y: -36,
724
+ width: 96,
725
+ height: 72
726
+ }), /* @__PURE__ */ h("g", {
727
+ fill: `url(#${i}-flight-fill)`,
728
+ filter: `url(#${i}-flight-goo)`,
729
+ children: /* @__PURE__ */ g("g", {
730
+ "data-presence-flight-body": "",
731
+ children: [/* @__PURE__ */ h("circle", { r: "16" }), /* @__PURE__ */ g("g", {
732
+ "data-presence-trail": "",
733
+ children: [/* @__PURE__ */ h("circle", {
734
+ cx: "-27",
735
+ cy: "5",
736
+ r: "4.5"
737
+ }), /* @__PURE__ */ h("circle", {
738
+ cx: "-36",
739
+ cy: "8",
740
+ r: "2.5"
741
+ })]
742
+ })]
743
+ })
744
+ })]
745
+ }),
746
+ /* @__PURE__ */ g("svg", {
747
+ className: "game-ui-liquid-presence-seat",
748
+ viewBox: "-56 -28 112 56",
749
+ "aria-hidden": "true",
750
+ focusable: "false",
751
+ style: { display: "none" },
752
+ children: [y("seat", {
753
+ x: -56,
754
+ y: -28,
755
+ width: 112,
756
+ height: 56
757
+ }), /* @__PURE__ */ h("path", {
758
+ "data-presence-seat-body": "",
759
+ d: N(48, 1),
760
+ fill: `url(#${i}-seat-fill)`,
761
+ filter: `url(#${i}-seat-goo)`
762
+ })]
763
+ }),
764
+ /* @__PURE__ */ h("div", {
765
+ className: `game-ui-liquid-presence-label${e.guideContent ? " game-ui-liquid-presence-label--guide" : ""}${e.guideContent && e.guideSize === "expanded" ? " game-ui-liquid-presence-label--expanded" : ""}`,
766
+ role: e.guideContent ? void 0 : "status",
767
+ "aria-atomic": !e.guideContent || void 0,
768
+ onClick: e.guideContent ? (e) => e.stopPropagation() : void 0,
769
+ onPointerDown: e.guideContent ? (e) => e.stopPropagation() : void 0,
770
+ onKeyDown: e.guideContent ? (e) => {
771
+ e.stopPropagation(), e.key === "Escape" && e.preventDefault();
772
+ } : void 0,
773
+ hidden: !0,
774
+ children: e.guideContent ?? e.target?.label.slice(0, 240)
775
+ })
776
+ ]
777
+ }), u)] });
778
+ }
779
+ //#endregion
780
+ //#region src/liquidRevealGeometry.ts
781
+ function K(e, n, r, a = 0, o = 1) {
782
+ let s = Math.max(44, e), c = Math.max(44, n), l = Math.min(28, (s - 12) / 2, (c - 12) / 2), u = i(6, 6, s - 12, c - 12, [
783
+ l,
784
+ l,
785
+ l,
786
+ l
787
+ ], {
788
+ amplitude: (r ? 8 : 11) * Math.min(1.25, Math.max(.25, Number.isFinite(o) ? o : 1)),
789
+ lobes: 3,
790
+ seed: 17,
791
+ phase: a
792
+ }), d = Math.max(0, l - 2.5);
793
+ return {
794
+ outline: u,
795
+ ribbon: `${u} ${t(8.5, 8.5, s - 17, c - 17, [
796
+ d,
797
+ d,
798
+ d,
799
+ d
800
+ ])}`
801
+ };
802
+ }
803
+ //#endregion
804
+ //#region src/useLiquidRevealAmbient.ts
805
+ function q(t, n, i, o, s, l = 1, u = 1) {
806
+ let f = d(0);
807
+ return c(() => {
808
+ let c = t.current;
809
+ if (!c || !n || !i || !o) {
810
+ c && (c.dataset.revealAmbient = "static");
811
+ return;
812
+ }
813
+ let d = !0, p = !0, m = performance.now(), h = () => {}, g = c.querySelector("[data-reveal-outline]"), _ = c.querySelector("[data-reveal-body]"), v = c.querySelector("[data-reveal-ribbon]"), y = (i + 24) * (o + 24), b = (t) => {
814
+ if (!d || !p || document.hidden) return;
815
+ let n = Math.min(160, Math.max(0, t - m));
816
+ m = t;
817
+ let x = document.querySelector("dialog:modal"), S = x && !x.contains(c) || ["drawing", "preparing"].includes(c.dataset.revealMotion ?? ""), C = a();
818
+ if (S || C.activeGroups > 0 || !e(y)) {
819
+ c.dataset.revealAmbient = "paused", h = te(b, 250);
820
+ return;
821
+ }
822
+ try {
823
+ f.current += n * Math.PI * 2 * u / 1e4;
824
+ let e = K(i, o, s, f.current, l);
825
+ g?.setAttribute("d", e.outline), _?.setAttribute("d", e.outline), v?.setAttribute("d", e.ribbon), c.dataset.revealAmbient = "flowing";
826
+ } finally {
827
+ r();
828
+ }
829
+ h = te(b);
830
+ }, x = () => {
831
+ h(), m = performance.now(), c.dataset.revealAmbient = "paused", p && !document.hidden && (h = te(b));
832
+ }, S = typeof IntersectionObserver > "u" ? null : new IntersectionObserver((e) => {
833
+ p = e[0]?.isIntersecting ?? !1, x();
834
+ });
835
+ return S?.observe(c), document.addEventListener("visibilitychange", x), x(), () => {
836
+ d = !1, h(), S?.disconnect(), document.removeEventListener("visibilitychange", x), c.dataset.revealAmbient = "static";
837
+ };
838
+ }, [
839
+ t,
840
+ n,
841
+ i,
842
+ o,
843
+ s,
844
+ l,
845
+ u
846
+ ]), f;
847
+ }
848
+ //#endregion
849
+ //#region src/liquidRevealEntranceGeometry.ts
850
+ var J = (e) => {
851
+ let t = Math.min(1, Math.max(0, e));
852
+ return t * t * t * (10 + t * (-15 + 6 * t));
853
+ };
854
+ function Y(e, t, n, r, a, o, s = 1) {
855
+ let c = K(e, t, n, 0, s).outline;
856
+ return Array.from({ length: 49 }, (l, u) => {
857
+ let d = u / 48, f = J((d - .08) / .34), p = j(r, a, f, o), m = J((d - .39) / .46), h = J((d - .47) / .46), g = J((d - .3) / .14) * (1 - m), _ = 8 + 20 * J(d / .15) + 10 * g, v = 1 + Math.sin(f * Math.PI) * .35, y = a.x - r.x, b = a.y - r.y, x = Math.abs(y) > Math.abs(b), S = _ * (x ? v : 1 / Math.sqrt(v)), C = _ * (x ? 1 / Math.sqrt(v) : v), w = S + (e - 12 - S) * m, T = C + (t - 12 - C) * h, E = (p.x - S / 2) * (1 - m) + 6 * m, D = (p.y - C / 2) * (1 - h) + 6 * h, O = Math.min(w / 2, T / 2, 28 + 12 * (1 - h));
858
+ return {
859
+ d: `path("${d >= .95 ? c : i(E, D, w, T, [
860
+ O,
861
+ O,
862
+ O,
863
+ O
864
+ ], {
865
+ amplitude: 1.2 + ((n ? 8 : 11) * s - 1.2) * h,
866
+ seed: 17,
867
+ lobes: 3,
868
+ phase: 0
869
+ })}")`,
870
+ offset: d
871
+ };
872
+ });
873
+ }
874
+ //#endregion
875
+ //#region src/useLiquidRevealEntrance.ts
876
+ function X(t, n, i, a, o, s, c, l, f = 1) {
877
+ let p = d(null);
878
+ u(() => {
879
+ let u = t.current;
880
+ if (!u) return;
881
+ if (!n || s || u.contains(document.activeElement) || window.matchMedia("(forced-colors: active)").matches) {
882
+ p.current = i, u.dataset.revealMotion = "static";
883
+ return;
884
+ }
885
+ if (p.current === i || (u.dataset.revealMotion = "preparing", !a || !o)) return;
886
+ let d = !0, m = !1, h = !1, g = 0, _ = 0, v = [], y = () => {
887
+ v.forEach((e) => e.cancel()), v.length = 0, m && r(), m = !1, u.dataset.revealMotion = h ? "settled" : "static";
888
+ }, b = () => {
889
+ if (!d) return;
890
+ if (getComputedStyle(u).visibility === "hidden") {
891
+ if (++_ < 12) {
892
+ g = requestAnimationFrame(b);
893
+ return;
894
+ }
895
+ y();
896
+ return;
897
+ }
898
+ let t = n.current?.getBoundingClientRect(), r = u.getBoundingClientRect(), s = u.querySelector("[data-reveal-body]"), x = u.querySelector("[data-reveal-material]"), S = u.querySelector(".game-ui-liquid-reveal-content");
899
+ if (p.current = i, u.contains(document.activeElement) || !t || !E(t) || document.hidden || typeof u.animate != "function" || !e((a + 24) * (o + 24))) {
900
+ y();
901
+ return;
902
+ }
903
+ m = !0, h = !0, u.dataset.revealMotion = "drawing";
904
+ let C = r.width / a || 1, w = r.height / o || 1, T = {
905
+ x: (t.x + t.width / 2 - r.x) / C,
906
+ y: (t.y + t.height / 2 - r.y) / w
907
+ }, D = {
908
+ x: Math.min(a - 28, Math.max(28, T.x)),
909
+ y: T.y > o / 2 ? o - 28 : 28
910
+ }, O = {
911
+ x: -r.x / C,
912
+ y: -r.y / w,
913
+ width: innerWidth / C,
914
+ height: innerHeight / w
915
+ };
916
+ if (c && s && CSS.supports("d", "path(\"M0 0L1 1Z\")")) {
917
+ let e = Y(a, o, l, T, D, O, f);
918
+ v.push(s.animate(e, {
919
+ duration: 720,
920
+ fill: "both",
921
+ easing: "linear"
922
+ })), x && v.push(x.animate([
923
+ { opacity: 0 },
924
+ {
925
+ opacity: 0,
926
+ offset: .93
927
+ },
928
+ { opacity: 1 }
929
+ ], {
930
+ duration: 720,
931
+ fill: "both"
932
+ })), S && v.push(S.animate([
933
+ { opacity: 0 },
934
+ {
935
+ opacity: 0,
936
+ offset: .78
937
+ },
938
+ {
939
+ opacity: 1,
940
+ offset: .98
941
+ },
942
+ { opacity: 1 }
943
+ ], {
944
+ duration: 720,
945
+ fill: "both"
946
+ }));
947
+ } else x && v.push(x.animate([{ opacity: .2 }, { opacity: 1 }], { duration: 180 }));
948
+ let k = n.current?.querySelector(".game-ui-liquid-presence > svg");
949
+ k && v.push(k.animate([
950
+ { transform: "scale(1)" },
951
+ {
952
+ transform: "scale(1.05, .9)",
953
+ offset: .22
954
+ },
955
+ {
956
+ transform: "scale(.96, 1.04)",
957
+ offset: .5
958
+ },
959
+ { transform: "scale(1)" }
960
+ ], {
961
+ duration: 440,
962
+ easing: "ease-in-out"
963
+ })), Promise.all(v.map((e) => e.finished)).then(y, y);
964
+ };
965
+ g = requestAnimationFrame(b);
966
+ let x = () => {
967
+ cancelAnimationFrame(g), y();
968
+ }, S = () => {
969
+ document.hidden && x();
970
+ };
971
+ return u.addEventListener("focusin", x), u.addEventListener("pointerdown", x, !0), document.addEventListener("visibilitychange", S), window.addEventListener("resize", x), window.addEventListener("scroll", x, !0), () => {
972
+ d = !1, x(), u.removeEventListener("focusin", x), u.removeEventListener("pointerdown", x, !0), document.removeEventListener("visibilitychange", S), window.removeEventListener("resize", x), window.removeEventListener("scroll", x, !0);
973
+ };
974
+ }, [
975
+ t,
976
+ n,
977
+ i,
978
+ a,
979
+ o,
980
+ s,
981
+ c,
982
+ l,
983
+ f
984
+ ]);
985
+ }
986
+ //#endregion
987
+ //#region src/LiquidReveal.tsx
988
+ function se({ children: e, source: t, revealKey: r = "initial", variant: i = "content", surface: o = "dark", reducedMotion: c, idleMotion: p = "still", colorFrom: m, colorTo: _, motionIntensity: v = 1, motionSpeed: y = 1, className: b = "" }) {
989
+ let x = s() || c === !0, S = T(v, .25, 1.25), C = T(y, .5, 1.5), w = d(null), [E, D] = f({
990
+ width: 0,
991
+ height: 0
992
+ }), O = `liquid-reveal-${l().replace(/[^a-zA-Z0-9_-]/g, "")}`;
993
+ u(() => {
994
+ let e = w.current;
995
+ if (!e) return;
996
+ let t = () => {
997
+ let t = e.clientWidth, n = e.clientHeight;
998
+ D((e) => e.width === t && e.height === n ? e : {
999
+ width: t,
1000
+ height: n
1001
+ });
1002
+ };
1003
+ t();
1004
+ let n = new ResizeObserver(t);
1005
+ return n.observe(e), () => n.disconnect();
1006
+ }, []), X(w, t, r, E.width, E.height, x, o === "material", i === "input", S);
1007
+ let k = Math.max(44, E.width), A = Math.max(44, E.height), ee = q(w, !x && p === "breathe", E.width, E.height, i === "input", S, C), j = K(k, A, i === "input", ee.current, S), M = (k + 24) * (A + 24) <= a().maxFilterArea;
1008
+ return /* @__PURE__ */ g("div", {
1009
+ ref: w,
1010
+ className: `game-ui-liquid-reveal ${b}`,
1011
+ style: {
1012
+ ...m ? { "--liquid-presence-from": m } : {},
1013
+ ..._ ? { "--liquid-presence-to": _ } : {}
1014
+ },
1015
+ "data-reveal-variant": i,
1016
+ "data-reveal-surface": o,
1017
+ "data-reveal-filter": M ? "volume" : "flat",
1018
+ children: [/* @__PURE__ */ h("div", {
1019
+ className: "game-ui-liquid-reveal-content",
1020
+ children: e
1021
+ }), E.width > 0 && /* @__PURE__ */ g("svg", {
1022
+ className: "game-ui-liquid-reveal-ink",
1023
+ width: k,
1024
+ height: A,
1025
+ viewBox: `0 0 ${k} ${A}`,
1026
+ "aria-hidden": "true",
1027
+ focusable: "false",
1028
+ children: [
1029
+ /* @__PURE__ */ g("defs", { children: [/* @__PURE__ */ g("linearGradient", {
1030
+ id: `${O}-fill`,
1031
+ x1: "0",
1032
+ y1: "0",
1033
+ x2: "1",
1034
+ y2: "1",
1035
+ children: [/* @__PURE__ */ h("stop", {
1036
+ offset: "0",
1037
+ stopColor: "var(--liquid-presence-from, var(--game-ui-secondary))"
1038
+ }), /* @__PURE__ */ h("stop", {
1039
+ offset: "1",
1040
+ stopColor: "var(--liquid-presence-to, var(--game-ui-secondary))"
1041
+ })]
1042
+ }), /* @__PURE__ */ h("filter", {
1043
+ id: `${O}-finish`,
1044
+ x: "-12",
1045
+ y: "-12",
1046
+ width: k + 24,
1047
+ height: A + 24,
1048
+ filterUnits: "userSpaceOnUse",
1049
+ colorInterpolationFilters: "sRGB",
1050
+ children: /* @__PURE__ */ h(n, {
1051
+ blur: 1.2,
1052
+ contrast: 18,
1053
+ gloss: 3.5,
1054
+ shadows: [],
1055
+ stroke: null,
1056
+ waviness: 0
1057
+ })
1058
+ })] }),
1059
+ o === "material" && /* @__PURE__ */ h("path", {
1060
+ "data-reveal-body": "",
1061
+ d: j.outline,
1062
+ fill: `url(#${O}-fill)`
1063
+ }),
1064
+ /* @__PURE__ */ g("g", {
1065
+ "data-reveal-material": "",
1066
+ filter: M ? `url(#${O}-finish)` : void 0,
1067
+ children: [/* @__PURE__ */ h("path", {
1068
+ "data-reveal-ribbon": "",
1069
+ d: j.ribbon,
1070
+ fillRule: "evenodd",
1071
+ fill: `url(#${O}-fill)`
1072
+ }), /* @__PURE__ */ h("path", {
1073
+ "data-reveal-outline": "",
1074
+ d: j.outline,
1075
+ pathLength: "1",
1076
+ fill: "none",
1077
+ stroke: `url(#${O}-fill)`,
1078
+ strokeWidth: "1.2",
1079
+ strokeLinecap: "round"
1080
+ })]
1081
+ })
1082
+ ]
1083
+ })]
1084
+ });
1085
+ }
1086
+ //#endregion
1087
+ //#region src/LiquidAnchor.tsx
1088
+ function Z({ source: e, children: t, placement: n = "top-end", onBoundsChange: r }) {
1089
+ let [i, a] = f(null), o = d(r);
1090
+ o.current = r;
1091
+ let [s, c] = f(null);
1092
+ return u(() => {
1093
+ c(e.current?.closest("dialog") ?? document.body);
1094
+ }, [e]), u(() => {
1095
+ let t = e.current, r = i;
1096
+ if (!t || !r) return;
1097
+ let a = !0, s = 0, c = null, l = null, u = () => {
1098
+ let e = getComputedStyle(t);
1099
+ for (let t of Array.from(e)) if (t.startsWith("--game-ui-") || t.startsWith("--liquid-presence-")) {
1100
+ let n = e.getPropertyValue(t);
1101
+ r.style.getPropertyValue(t) !== n && r.style.setProperty(t, n);
1102
+ }
1103
+ let n = t.querySelector(".game-ui-liquid-presence");
1104
+ if (n) {
1105
+ let e = getComputedStyle(n);
1106
+ for (let t of ["--liquid-presence-from", "--liquid-presence-to"]) r.style.setProperty(t, e.getPropertyValue(t));
1107
+ }
1108
+ }, d = () => {
1109
+ let e = ++s, i = t.getBoundingClientRect(), u = document.querySelector("dialog:modal");
1110
+ if (c !== u && (l?.disconnect(), l = null, c = u, u && !u.contains(t) && !r.contains(u) && (l = new MutationObserver(() => {
1111
+ (!u.isConnected || !u.matches(":modal")) && d();
1112
+ }), l.observe(u, {
1113
+ attributes: !0,
1114
+ attributeFilter: ["open"]
1115
+ }), u.parentNode && l.observe(u.parentNode, { childList: !0 }))), !t.isConnected || t.closest("[hidden], [inert], [aria-hidden=\"true\"]") || typeof t.checkVisibility == "function" && !t.checkVisibility({
1116
+ opacityProperty: !0,
1117
+ visibilityProperty: !0
1118
+ }) || i.width <= 0 || i.height <= 0 || u && !u.contains(t) && !r.contains(u)) {
1119
+ r.style.visibility = "hidden", o.current?.(null);
1120
+ return;
1121
+ }
1122
+ y(t, r, {
1123
+ strategy: "fixed",
1124
+ placement: n,
1125
+ middleware: [
1126
+ S(14),
1127
+ b({ padding: 12 }),
1128
+ C({
1129
+ padding: 12,
1130
+ crossAxis: !0
1131
+ }),
1132
+ w({
1133
+ padding: 12,
1134
+ apply({ availableHeight: e, availableWidth: t }) {
1135
+ r.dataset.liquidCompact = e < 500 ? "true" : "false", r.style.setProperty("--liquid-outlet-height", `${Math.max(0, e)}px`), r.style.maxWidth = `${Math.max(0, t)}px`;
1136
+ }
1137
+ }),
1138
+ x({ strategy: "referenceHidden" })
1139
+ ]
1140
+ }).then(({ x: t, y: n, middlewareData: i }) => {
1141
+ if (!a || e !== s) return;
1142
+ if (i.hide?.referenceHidden) {
1143
+ r.style.visibility = "hidden", o.current?.(null);
1144
+ return;
1145
+ }
1146
+ r.style.left = `${t}px`, r.style.top = `${n}px`, r.style.visibility = "visible";
1147
+ let c = r.getBoundingClientRect();
1148
+ o.current?.({
1149
+ x: c.x,
1150
+ y: c.y,
1151
+ width: c.width,
1152
+ height: c.height
1153
+ });
1154
+ }).catch(() => {
1155
+ !a || e !== s || (r.style.visibility = "hidden", o.current?.(null));
1156
+ });
1157
+ };
1158
+ u();
1159
+ let f = v(t, r, d), p = new MutationObserver(() => {
1160
+ u(), d();
1161
+ });
1162
+ for (let e = t; e; e = e.parentElement) p.observe(e, {
1163
+ attributes: !0,
1164
+ attributeFilter: [
1165
+ "class",
1166
+ "style",
1167
+ "data-game-ui-theme",
1168
+ "hidden",
1169
+ "inert",
1170
+ "aria-hidden"
1171
+ ]
1172
+ });
1173
+ let m = t.querySelector(".game-ui-liquid-presence");
1174
+ return m && p.observe(m, {
1175
+ attributes: !0,
1176
+ attributeFilter: [
1177
+ "class",
1178
+ "style",
1179
+ "data-activity"
1180
+ ]
1181
+ }), document.addEventListener("toggle", d, !0), document.addEventListener("close", d, !0), () => {
1182
+ a = !1, s++, f(), p.disconnect(), l?.disconnect(), document.removeEventListener("toggle", d, !0), document.removeEventListener("close", d, !0), o.current?.(null);
1183
+ };
1184
+ }, [
1185
+ i,
1186
+ n,
1187
+ e
1188
+ ]), s ? /* @__PURE__ */ h(_, {
1189
+ root: s,
1190
+ preserveTabOrder: !1,
1191
+ children: /* @__PURE__ */ h("div", {
1192
+ ref: a,
1193
+ className: "game-ui-liquid-anchor",
1194
+ style: {
1195
+ position: "fixed",
1196
+ top: 0,
1197
+ left: 0,
1198
+ visibility: "hidden"
1199
+ },
1200
+ children: t
1201
+ })
1202
+ }) : null;
1203
+ }
1204
+ //#endregion
1205
+ export { Z as LiquidAnchor, G as LiquidPresence, se as LiquidReveal };