@pieai/swimmer-ui-kit 2.8.0 → 2.9.0

package/dist/liquid-presence.js

@@ -0,0 +1,689 @@
+import { _ as e, d as t, h as n, i as r, m as i, n as a, t as o } from "./reducedMotion-C7O9ls34.js";
+import { useEffect as s, useId as c, useRef as l, useState as u } from "react";
+import { createPortal as d } from "react-dom";
+import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
+import { autoUpdate as h, computePosition as g, flip as _, offset as v, shift as y } from "@floating-ui/react";
+function b(e, t, n) {
+	return Number.isFinite(e) ? Math.max(t, Math.min(n, e)) : t;
+}
+function x(e) {
+	return !!(e && [
+		e.x,
+		e.y,
+		e.width,
+		e.height
+	].every(Number.isFinite) && e.width > 0 && e.height > 0);
+}
+function S(e, t) {
+	return x(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;
+}
+function C(e) {
+	return {
+		x: e.x + e.width / 2,
+		y: e.y + e.height / 2
+	};
+}
+function w(e, t) {
+	let n = Math.hypot(t.x - e.x, t.y - e.y) || 1;
+	return {
+		x: (t.x - e.x) / n,
+		y: (t.y - e.y) / n
+	};
+}
+function ee(e, t) {
+	let n = Math.max(e.x, t.x), r = Math.max(e.y, t.y);
+	return {
+		x: n,
+		y: r,
+		width: Math.max(0, Math.min(e.x + e.width, t.x + t.width) - n),
+		height: Math.max(0, Math.min(e.y + e.height, t.y + t.height) - r)
+	};
+}
+function te(e, t) {
+	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 = b(Math.max(0, a - i) * .58, 36, 84);
+	return {
+		x: b((i + a) / 2, t.x + o / 2 + 8, t.x + t.width - o / 2 - 8),
+		y: b(n ? e.y + e.height + 10 : e.y - 10, t.y + 18, t.y + t.height - 18),
+		side: r,
+		width: o
+	};
+}
+function T(e, t, n, r) {
+	let i = b(n, 0, 1), a = w(e, t), o = Math.min(86, Math.hypot(t.x - e.x, t.y - e.y) * .2), s = {
+		x: b((e.x + t.x) / 2 + a.y * o, r.x + 16, r.x + r.width - 16),
+		y: b((e.y + t.y) / 2 - a.x * o, r.y + 16, r.y + r.height - 16)
+	}, 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);
+	return {
+		x: (1 - i) ** 2 * e.x + 2 * (1 - i) * i * s.x + i ** 2 * t.x,
+		y: (1 - i) ** 2 * e.y + 2 * (1 - i) * i * s.y + i ** 2 * t.y,
+		angle: Math.atan2(l, c) * 180 / Math.PI
+	};
+}
+function E(e = 0, t = 0, n = 0) {
+	let i = 66 * Math.sqrt(1 - .075 * b(n, 0, 1));
+	return r(80 - i, 80 - i, i * 2, i * 2, [
+		i,
+		i,
+		i,
+		i
+	], {
+		amplitude: 3.5 + b(t, 0, 1) * 9,
+		lobes: 3,
+		seed: 17,
+		phase: e
+	});
+}
+function D(e, t, n = 20) {
+	let i = b(t, 0, 1), a = b(n, 6, 48), o = a + (e - a) * i, s = a + (8 - a) * i;
+	return r(-o / 2, -s / 2, o, s, [
+		s / 2,
+		s / 2,
+		s / 2,
+		s / 2
+	], {
+		amplitude: 2.2,
+		phase: i * Math.PI,
+		seed: 17,
+		lobes: 3
+	});
+}
+//#endregion
+//#region src/liquidPresenceMotion.ts
+var O = a("cubic-bezier(0.45, 0, 0.2, 1)");
+function ne(e) {
+	let { source: t, destination: n, viewport: r, returning: i = !1, from: a, origin: o } = e, s = o?.seat == null ? 0 : 180;
+	if (s && e.elapsed < s) return {
+		...o,
+		phase: "gather",
+		seat: o.seat * (1 - O(b(e.elapsed / s, 0, 1)))
+	};
+	let c = Math.max(0, e.elapsed - s), l = C(t), u = w(l, n), d = Math.atan2(u.y, u.x) * 180 / Math.PI, f = t.width / 160, p = {
+		x: l.x + u.x * 112 * f,
+		y: l.y + u.y * 112 * f
+	}, m = {
+		phase: "still",
+		point: l,
+		angle: d,
+		diameter: 16 * f * 2,
+		stretch: 1,
+		separation: 0,
+		bud: null,
+		seat: null
+	};
+	if (i) {
+		if (o?.bud) {
+			let e = O(b(c / 320, 0, 1)), t = o.bud.x + (80 - o.bud.x) * e, n = o.bud.y + (80 - o.bud.y) * e;
+			return {
+				...m,
+				phase: e < 1 ? "merge" : "still",
+				separation: o.separation * (1 - e),
+				point: {
+					x: l.x + (t - 80) * f,
+					y: l.y + (n - 80) * f
+				},
+				bud: e < 1 ? {
+					x: t,
+					y: n,
+					radius: o.bud.radius * (1 - e)
+				} : null
+			};
+		}
+		let e = b(c / 620, 0, 1);
+		if (e < 1) {
+			let t = T(a ?? n, p, O(e), r);
+			return {
+				...m,
+				phase: "return",
+				separation: 1,
+				angle: t.angle,
+				point: t,
+				stretch: 1 + .3 * Math.sin(e * Math.PI)
+			};
+		}
+		let t = b((c - 620) / 420, 0, 1), i = 112 - 78 * O(t);
+		return {
+			...m,
+			phase: t < 1 ? "merge" : "still",
+			separation: 1 - O(t),
+			point: {
+				x: l.x + u.x * i * f,
+				y: l.y + u.y * i * f
+			},
+			bud: t < 1 ? {
+				x: 80 + u.x * i,
+				y: 80 + u.y * i,
+				radius: 16 * (1 - .65 * O(t))
+			} : null
+		};
+	}
+	let h = o?.phase === "split" ? o.bud : null, g = h ? o.separation : 0, _ = h ? Math.max(180, 460 * (1 - g)) : a ? 0 : 460;
+	if (c < _) {
+		let e = O(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;
+		return {
+			...m,
+			phase: "split",
+			separation: g + (1 - g) * e,
+			point: {
+				x: l.x + (n - 80) * f,
+				y: l.y + (r - 80) * f
+			},
+			bud: {
+				x: n,
+				y: r,
+				radius: i + (16 - i) * e
+			}
+		};
+	}
+	let v = a ?? p, y = 560 + Math.min(260, Math.hypot(n.x - v.x, n.y - v.y) * .26), x = b((c - _) / y, 0, 1);
+	if (x < 1) {
+		let e = T(v, n, O(x), r);
+		return {
+			...m,
+			phase: "flight",
+			separation: 1,
+			point: e,
+			angle: e.angle,
+			stretch: 1 + .35 * Math.sin(x * Math.PI)
+		};
+	}
+	let S = b((c - _ - y) / 380, 0, 1);
+	return {
+		...m,
+		phase: S < 1 ? "land" : "dock",
+		separation: 1,
+		point: n,
+		seat: O(S)
+	};
+}
+//#endregion
+//#region src/liquidPresencePaint.ts
+function k(e, t) {
+	e.toggleAttribute("hidden", !t);
+	let n = e.style, r = t ? "" : "none";
+	n.display !== r && (n.display = r);
+}
+var A = (e, t, n) => {
+	let r = String(n);
+	e.getAttribute(t) !== r && e.setAttribute(t, r);
+};
+function j(e, t, n) {
+	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;
+	return {
+		x: (t - r.x) / i,
+		y: (n - r.y) / a
+	};
+}
+function re(e, t, n, r, i = 0) {
+	A(e.source, "data-liquid-phase", t.phase), A(e.overlay, "data-liquid-phase", t.phase), A(e.body, "d", E(r, i, t.separation));
+	let a = t.bud ? Math.sin(t.separation * Math.PI) * .045 : 0;
+	A(e.body, "transform", `translate(${((t.bud?.x ?? 80) - 80) * a} ${((t.bud?.y ?? 80) - 80) * a})`), k(e.bud, !!t.bud), t.bud && (A(e.bud, "cx", t.bud.x), A(e.bud, "cy", t.bud.y), A(e.bud, "r", t.bud.radius));
+	let o = t.phase === "flight" || t.phase === "return";
+	k(e.flight, o);
+	let s = j(e, t.point.x, t.point.y);
+	if (o) {
+		let n = t.diameter / 32;
+		e.flight.style.transform = `translate(${s.x - 48}px, ${s.y - 36}px)`, A(e.flightBody, "transform", `rotate(${t.angle}) scale(${n * t.stretch} ${n / Math.sqrt(t.stretch)})`), A(e.trail, "opacity", Math.min(.8, (t.stretch - 1) * 3));
+	}
+	k(e.seat, t.seat !== null), t.seat !== null && (e.seat.style.transform = `translate(${s.x - 56}px, ${s.y - 28}px)`, A(e.seatBody, "d", D(t.seatWidth ?? n, t.seat, t.diameter))), k(e.label, t.phase !== "gather" && t.seat !== null && t.seat > .45);
+}
+function ie(e, t, n, r) {
+	e.satellites.forEach((e, i) => {
+		if (k(e, n), !n) return;
+		let a = t * .7 + i * Math.PI * 2 / 3, o = 63 + Math.max(0, Math.sin(t * 1.6 + i * 2)) * (16 + r * 12);
+		A(e, "cx", 80 + Math.cos(a) * o), A(e, "cy", 80 + Math.sin(a) * o), A(e, "r", 7 + i * 1.5);
+	});
+}
+function M() {
+	let e = window.visualViewport;
+	return {
+		x: e?.offsetLeft ?? 0,
+		y: e?.offsetTop ?? 0,
+		width: e?.width ?? innerWidth,
+		height: e?.height ?? innerHeight
+	};
+}
+//#endregion
+//#region src/liquidPresenceTracking.ts
+function N(e) {
+	try {
+		let t = e.contextElement;
+		if (t && t.ownerDocument !== document || t && (!t.isConnected || t.closest("[hidden], [inert]")) || t && getComputedStyle(t).visibility === "hidden") return null;
+		let n = document.querySelector("dialog:modal");
+		if (n && (!t || !n.contains(t))) return null;
+		let r = e.getRect();
+		return x(r) && S(r, M()) ? r : null;
+	} catch {
+		return null;
+	}
+}
+function ae(e, t, n, r) {
+	let i = t.contextElement, a = {
+		...i ? { contextElement: i } : {},
+		getBoundingClientRect: () => {
+			let e = N(t) ?? {
+				x: 0,
+				y: 0,
+				width: 0,
+				height: 0
+			};
+			return {
+				...e,
+				top: e.y,
+				left: e.x,
+				right: e.x + e.width,
+				bottom: e.y + e.height
+			};
+		}
+	}, o = /* @__PURE__ */ new Set();
+	for (let t of [e, i]) for (let e = t; e; e = e.parentElement) o.add(e);
+	let s = new MutationObserver(r);
+	for (let e of o) s.observe(e, {
+		attributes: !0,
+		attributeFilter: [
+			"style",
+			"class",
+			"hidden",
+			"inert",
+			"open"
+		]
+	});
+	let c = new MutationObserver((t) => {
+		(!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();
+	});
+	c.observe(document.body, {
+		subtree: !0,
+		childList: !0,
+		attributes: !0,
+		attributeFilter: ["open", "inert"]
+	});
+	let l = () => {}, u = !1, d = /* @__PURE__ */ new Map(), f = (e) => {
+		l(), u = e, l = h(i ?? a, n, r, { animationFrame: !i || e });
+	}, p = (e) => {
+		if (!(e.target instanceof Element) || !o.has(e.target)) return;
+		let t = "propertyName" in e ? String(e.propertyName) : "animationName" in e ? String(e.animationName) : e.type, n = d.get(e.target) ?? /* @__PURE__ */ new Set();
+		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();
+	}, m = [
+		"transitionrun",
+		"transitionend",
+		"transitioncancel",
+		"animationstart",
+		"animationend",
+		"animationcancel"
+	];
+	for (let e of m) document.addEventListener(e, p, !0);
+	return f(!1), () => {
+		l(), s.disconnect(), c.disconnect();
+		for (let e of m) document.removeEventListener(e, p, !0);
+	};
+}
+//#endregion
+//#region src/useLiquidPresenceMotion.ts
+function P(t, r, a, o) {
+	let c = l(a);
+	c.current = a;
+	let u = l(null), d = l(null), f = l(null), p = l(0), m = l(() => {});
+	s(() => {
+		let a = t.current, o = r.current;
+		if (!a || !o) return;
+		let s = {
+			source: a,
+			overlay: o,
+			body: a.querySelector("[data-presence-body]"),
+			bud: a.querySelector("[data-presence-bud]"),
+			satellites: [...a.querySelectorAll("[data-presence-satellite]")],
+			flight: o.querySelector(".game-ui-liquid-presence-flight"),
+			flightBody: o.querySelector("[data-presence-flight-body]"),
+			trail: o.querySelector("[data-presence-trail]"),
+			seat: o.querySelector(".game-ui-liquid-presence-seat"),
+			seatBody: o.querySelector("[data-presence-seat-body]"),
+			label: o.querySelector(".game-ui-liquid-presence-label")
+		}, l = c.current.target ?? null;
+		l || (d.current = null), l?.key === d.current && (l = null);
+		let h = u.current, x = !l && !!(h && h.phase !== "still"), w = h && [
+			"flight",
+			"dock",
+			"land",
+			"gather",
+			"return"
+		].includes(h.phase) ? h.point : void 0, T = h?.point ?? C(a.getBoundingClientRect()), E = h?.seatWidth ?? 48, D = h ?? void 0, O = a.getBoundingClientRect(), A = performance.now(), j = null, P = !0, F = !1, I = !0, L = 0, R = p.current, z = performance.now(), B = 0, V = 0, H = () => {}, U, W = () => {
+			F && n(), F = !1;
+		}, G = (e) => {
+			if (l) {
+				d.current = l.key, l = null, x = !!(u.current && u.current.phase !== "still"), D = u.current ?? void 0, w = u.current?.point, T = w ?? T, A = performance.now(), H(), clearTimeout(U), V++, k(s.label, !1);
+				try {
+					c.current.onDismiss?.(e);
+				} catch {}
+				Z();
+			}
+		}, K = () => l ? N(c.current.target?.key === l.key ? c.current.target : l) : null, q = () => {
+			if (!l) return;
+			let e = K();
+			if (!e) {
+				G("unavailable");
+				return;
+			}
+			let t = te(e, M()), n = ee(e, M());
+			T = t, E = t.width;
+			let r = {
+				...l.contextElement ? { contextElement: l.contextElement } : {},
+				getBoundingClientRect: () => ({
+					...n,
+					top: n.y,
+					left: n.x,
+					bottom: n.y + n.height,
+					right: n.x + n.width
+				})
+			}, i = ++V;
+			g(r, s.label, {
+				strategy: "absolute",
+				placement: t.side,
+				middleware: [
+					v(26),
+					_(),
+					y({
+						padding: 16,
+						crossAxis: !0
+					})
+				]
+			}).then(({ x: e, y: t }) => {
+				P && i === V && (s.label.style.transform = `translate(${e}px, ${t}px)`);
+			}).catch(() => {});
+		}, J = () => [
+			"connecting",
+			"listening",
+			"thinking",
+			"speaking",
+			"working"
+		].includes(c.current.activity ?? "idle"), oe = () => {
+			if (c.current.reducedMotion || c.current.activity === "disabled" || document.hidden || !I || !S(a.getBoundingClientRect(), M())) return !1;
+			let t = document.querySelector("dialog:modal");
+			if (t && !t.contains(a)) return !1;
+			let n = l?.contextElement?.closest("dialog") ?? null;
+			if (l && a.closest("dialog") !== n) return !1;
+			let r = 13184 + (a.getBoundingClientRect().width * 2) ** 2, o = i();
+			return o.maxAnimatedGroups === 0 || r > o.maxFilterArea ? (W(), !1) : (F ||= e(r), F);
+		};
+		function Y(e) {
+			if (!P || document.hidden) return;
+			let t = s.source.getBoundingClientRect();
+			if (!s.source.isConnected || s.source.closest("[hidden], [inert]") || t.width <= 0 || t.height <= 0) {
+				x = !1, u.current = null, G("unavailable"), k(s.label, !1), k(s.flight, !1), k(s.seat, !1), W();
+				return;
+			}
+			if (l && !K()) {
+				G("unavailable");
+				return;
+			}
+			let n = oe(), r = ne({
+				elapsed: e - A,
+				source: x ? t : O,
+				destination: T,
+				viewport: M(),
+				returning: x,
+				...w ? { from: w } : {},
+				...D ? { origin: D } : {}
+			});
+			!l && !x && (r = {
+				...r,
+				phase: "still",
+				separation: 0,
+				bud: null,
+				seat: null
+			}), (!n || l && f.current === l.key) && (r = {
+				...r,
+				phase: l ? "dock" : "still",
+				point: T,
+				bud: null,
+				seat: l ? 1 : null,
+				separation: +!!l
+			}), x && r.phase === "still" && (x = !1), l && r.phase === "dock" && (f.current = l.key);
+			let i = !["still", "dock"].includes(r.phase), a = c.current.levelRef?.current, o = Math.max(0, Math.min(64, e - z));
+			z = e;
+			let d = typeof a == "number" ? b(a, 0, 1) : 0;
+			B += (d - B) * (1 - Math.exp(-o / (d > B ? 65 : 140))), n && (i || J()) && (R += o * .00105), p.current = R;
+			let m = n && J() && !i ? .14 + B * .75 : i ? .2 : 0, h = s.label.hasAttribute("hidden");
+			re(s, r, E, R, m), ie(s, R, n && c.current.activity === "speaking" && r.phase === "still", B);
+			let g = n && (i || J()) ? "animated" : "static";
+			s.source.dataset.liquidMotion !== g && (s.source.dataset.liquidMotion = g), u.current = {
+				...r,
+				seatWidth: r.phase === "gather" ? D?.seatWidth ?? E : E
+			}, l && h && !s.label.hasAttribute("hidden") && q(), n && (i || J()) ? j = requestAnimationFrame(X) : W();
+		}
+		function X(e) {
+			if (j = null, !P || document.hidden) {
+				W();
+				return;
+			}
+			if ((u.current?.phase === "still" || u.current?.phase === "dock") && e - L < 32) {
+				j = requestAnimationFrame(X);
+				return;
+			}
+			L = e, Y(e);
+		}
+		function Z() {
+			!P || j !== null || document.hidden || Y(performance.now());
+		}
+		m.current = Z;
+		let Q = () => {
+			if (H(), H = () => {}, !l || document.hidden) return;
+			let e = ae(s.source, l, s.label, () => {
+				q(), Z();
+			});
+			H = e, l || e();
+		};
+		l && (s.label.textContent = l.label.slice(0, 240), q(), l && (Q(), l && (U = setTimeout(() => G("expired"), 12e3))));
+		let $ = (e) => {
+			e.key === "Escape" && G("dismissed");
+		}, se = (e) => {
+			l?.contextElement && e.target instanceof Node && l.contextElement.contains(e.target) && G("dismissed");
+		}, ce = () => {
+			document.hidden ? (j !== null && cancelAnimationFrame(j), j = null, H(), V++, W()) : (z = performance.now(), Q(), Z());
+		}, le = typeof IntersectionObserver > "u" ? null : new IntersectionObserver((e) => {
+			I = e[0]?.isIntersecting ?? !0, I || (j !== null && cancelAnimationFrame(j), j = null, W()), Z();
+		});
+		return le?.observe(a), document.addEventListener("keydown", $), document.addEventListener("click", se), document.addEventListener("visibilitychange", ce), Z(), () => {
+			P = !1, m.current = () => {}, V++, j !== null && cancelAnimationFrame(j), clearTimeout(U), H(), le?.disconnect(), W(), document.removeEventListener("keydown", $), document.removeEventListener("click", se), document.removeEventListener("visibilitychange", ce);
+		};
+	}, [
+		t,
+		r,
+		o,
+		a.target?.key,
+		a.reducedMotion,
+		a.size
+	]), s(() => m.current(), [a.activity]);
+}
+//#endregion
+//#region src/LiquidPresence.tsx
+function F(e) {
+	let n = o() || e.reducedMotion === !0, r = b(e.size ?? 64, 32, 224), i = `presence-${c().replace(/[^a-zA-Z0-9_-]/g, "")}`, a = l(null), h = l(null), [g, _] = u(null);
+	s(() => {
+		let t = e.target?.contextElement?.closest("dialog");
+		_(t ?? a.current?.closest("dialog") ?? document.body);
+	}, [e.target?.contextElement]), s(() => {
+		let e = a.current, t = h.current;
+		if (!e || !t) return;
+		let n = [
+			"--liquid-presence-from",
+			"--liquid-presence-to",
+			"--game-ui-secondary",
+			"--game-ui-warning",
+			"--game-ui-panel-strong",
+			"--game-ui-text",
+			"--game-ui-font-body",
+			"--game-ui-radius-control",
+			"--game-ui-shadow-button"
+		], r = () => {
+			let r = getComputedStyle(e);
+			for (let e of n) {
+				let n = r.getPropertyValue(e).trim();
+				t.style.getPropertyValue(e) !== n && t.style.setProperty(e, n);
+			}
+		}, i = new MutationObserver(r);
+		for (let t = e; t; t = t.parentElement) i.observe(t, {
+			attributes: !0,
+			attributeFilter: [
+				"class",
+				"style",
+				"data-game-ui-theme",
+				"data-activity"
+			]
+		});
+		return r(), window.addEventListener("resize", r, { passive: !0 }), () => {
+			i.disconnect(), window.removeEventListener("resize", r);
+		};
+	}, [g]), P(a, h, {
+		...e,
+		size: r,
+		reducedMotion: n
+	}, g);
+	let v = {
+		width: r,
+		height: r,
+		...e.colorFrom ? { "--liquid-presence-from": e.colorFrom } : {},
+		...e.colorTo ? { "--liquid-presence-to": e.colorTo } : {},
+		...["error", "unknown"].includes(e.activity ?? "") ? {
+			"--liquid-presence-from": "var(--game-ui-warning)",
+			"--liquid-presence-to": "var(--game-ui-warning)"
+		} : {}
+	}, y = (e, n) => /* @__PURE__ */ m("defs", { children: [/* @__PURE__ */ m("linearGradient", {
+		id: `${i}-${e}-fill`,
+		gradientUnits: "userSpaceOnUse",
+		x1: e === "core" ? 24 : -24,
+		y1: e === "core" ? 16 : -18,
+		x2: e === "core" ? 136 : 24,
+		y2: e === "core" ? 146 : 18,
+		children: [/* @__PURE__ */ p("stop", {
+			offset: "0",
+			stopColor: "var(--liquid-presence-from, var(--game-ui-secondary))"
+		}), /* @__PURE__ */ p("stop", {
+			offset: "1",
+			stopColor: "var(--liquid-presence-to, var(--game-ui-secondary))"
+		})]
+	}), /* @__PURE__ */ p("filter", {
+		id: `${i}-${e}-goo`,
+		filterUnits: "userSpaceOnUse",
+		...n,
+		colorInterpolationFilters: "sRGB",
+		children: /* @__PURE__ */ p(t, {
+			blur: e === "core" ? 5 : 2,
+			contrast: 18,
+			gloss: 3.5,
+			shadows: [],
+			stroke: null,
+			waviness: 0
+		})
+	})] });
+	return /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("span", {
+		ref: a,
+		className: `game-ui-liquid-presence ${e.className ?? ""}`,
+		style: v,
+		"data-activity": e.activity ?? "idle",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ m("svg", {
+			viewBox: "0 0 160 160",
+			focusable: "false",
+			children: [y("core", {
+				x: -80,
+				y: -80,
+				width: 320,
+				height: 320
+			}), /* @__PURE__ */ m("g", {
+				fill: `url(#${i}-core-fill)`,
+				filter: `url(#${i}-core-goo)`,
+				children: [
+					/* @__PURE__ */ p("path", {
+						"data-presence-body": "",
+						d: E()
+					}),
+					/* @__PURE__ */ p("circle", {
+						"data-presence-bud": "",
+						cx: "80",
+						cy: "80",
+						r: "0",
+						style: { display: "none" }
+					}),
+					[
+						0,
+						1,
+						2
+					].map((e) => /* @__PURE__ */ p("circle", {
+						"data-presence-satellite": "",
+						cx: "80",
+						cy: "80",
+						r: "0",
+						style: { display: "none" }
+					}, e))
+				]
+			})]
+		})
+	}), g && d(/* @__PURE__ */ m("div", {
+		ref: h,
+		className: "game-ui-liquid-presence-overlay",
+		style: {
+			...v,
+			width: void 0,
+			height: void 0
+		},
+		"data-presence-overlay": "",
+		children: [
+			/* @__PURE__ */ m("svg", {
+				className: "game-ui-liquid-presence-flight",
+				viewBox: "-48 -36 96 72",
+				"aria-hidden": "true",
+				focusable: "false",
+				style: { display: "none" },
+				children: [y("flight", {
+					x: -48,
+					y: -36,
+					width: 96,
+					height: 72
+				}), /* @__PURE__ */ p("g", {
+					fill: `url(#${i}-flight-fill)`,
+					filter: `url(#${i}-flight-goo)`,
+					children: /* @__PURE__ */ m("g", {
+						"data-presence-flight-body": "",
+						children: [/* @__PURE__ */ p("circle", { r: "16" }), /* @__PURE__ */ m("g", {
+							"data-presence-trail": "",
+							children: [/* @__PURE__ */ p("circle", {
+								cx: "-27",
+								cy: "5",
+								r: "4.5"
+							}), /* @__PURE__ */ p("circle", {
+								cx: "-36",
+								cy: "8",
+								r: "2.5"
+							})]
+						})]
+					})
+				})]
+			}),
+			/* @__PURE__ */ m("svg", {
+				className: "game-ui-liquid-presence-seat",
+				viewBox: "-56 -28 112 56",
+				"aria-hidden": "true",
+				focusable: "false",
+				style: { display: "none" },
+				children: [y("seat", {
+					x: -56,
+					y: -28,
+					width: 112,
+					height: 56
+				}), /* @__PURE__ */ p("path", {
+					"data-presence-seat-body": "",
+					d: D(48, 1),
+					fill: `url(#${i}-seat-fill)`,
+					filter: `url(#${i}-seat-goo)`
+				})]
+			}),
+			/* @__PURE__ */ p("span", {
+				className: "game-ui-liquid-presence-label",
+				role: "status",
+				"aria-atomic": "true",
+				hidden: !0
+			})
+		]
+	}), g)] });
+}
+//#endregion
+export { F as LiquidPresence };