171 lines
8.2 KiB
JavaScript
171 lines
8.2 KiB
JavaScript
|
|
import {
|
||
|
|
require_react
|
||
|
|
} from "./chunk-IO7TC67E.js";
|
||
|
|
import {
|
||
|
|
__toESM
|
||
|
|
} from "./chunk-DC5AMYBS.js";
|
||
|
|
|
||
|
|
// node_modules/@blobatar/react/dist/gaze.js
|
||
|
|
var import_react = __toESM(require_react());
|
||
|
|
|
||
|
|
// node_modules/blobatar/dist/gaze.js
|
||
|
|
var ae = (e) => e * e * (3 - 2 * e);
|
||
|
|
var ce = (e, n, a) => Math.min(a, Math.max(n, e));
|
||
|
|
var ie = (e, n = 110) => n <= 0 ? 1 : 1 - Math.exp(-e / n);
|
||
|
|
function le(e, n) {
|
||
|
|
let a = n * (e / 100);
|
||
|
|
return a > 0 ? ce(0.15 / a, 2e-3, 0.06) : 0.06;
|
||
|
|
}
|
||
|
|
var D = 0.97;
|
||
|
|
var me = 4;
|
||
|
|
var oe = (e, n, a) => {
|
||
|
|
let r = e * e + n * n;
|
||
|
|
if (r < 1e-9) return { sx: 1, sy: 1, sh: 0 };
|
||
|
|
let h = Math.max(0, a);
|
||
|
|
return { sx: (h * e * e + n * n) / r, sy: (h * n * n + e * e) / r, sh: (h - 1) * e * n / r };
|
||
|
|
};
|
||
|
|
function ue(e, n, a) {
|
||
|
|
let r = e.x * e.x + e.y * e.y, h = r > 1 ? 1 / Math.sqrt(r) : 1, y = e.x * h, m = e.y * h, E = Math.sqrt(Math.max(0, 1 - y * y - m * m)), g = Math.cos(n), S = Math.sin(n), f = y * g + E * S, P = E * g - y * S, b = Math.cos(a), i2 = Math.sin(a), c = m * b + P * i2, o = P * b - m * i2, s2 = Math.hypot(f, c), l = o <= 0 || s2 > D, M = l ? D / (s2 || 1) : 1, d = f * M, x = c * M, G = l ? Math.sqrt(1 - D * D) : o, u = oe(y, m, E), v = oe(d, x, G);
|
||
|
|
return { dx: d - e.x, dy: x - e.y, sx: Math.min(1, v.sx / (u.sx || 1)), sy: Math.min(1, v.sy / (u.sy || 1)), t: me * (v.sh - u.sh) };
|
||
|
|
}
|
||
|
|
function he(e) {
|
||
|
|
let n = Math.hypot(e.dx, e.dy), a = e.radius > 0 ? ae(Math.min(1, n / (e.radius * 0.55))) : 1, r = (e.gain ?? 1) * a, h = n > 0 ? e.dx / n * r : 0, y = n > 0 ? e.dy / n * r : 0, m = Math.hypot(h - e.x, y - e.y) > (e.snap ?? 1.6) ? 1 : e.k;
|
||
|
|
return { x: e.x + (h - e.x) * m, y: e.y + (y - e.y) * m, tx: h, ty: y, f: m };
|
||
|
|
}
|
||
|
|
function ye(e) {
|
||
|
|
let n = e.querySelector(".mo-bob > g:not(.mo-eyes)"), a = [...e.querySelectorAll(".mo-eye")];
|
||
|
|
if (!n || !a.length) return null;
|
||
|
|
try {
|
||
|
|
let r = n.getBBox(), h = [...n.querySelectorAll("path,circle")], y = r.x + r.width / 2, m = r.y + r.height / 2, E = (o, s2, l) => h.some((M) => M.isPointInFill(new DOMPoint(y + o * r.width / 2 * s2, m + o * r.height / 2 * l))), g = 1;
|
||
|
|
for (let o = 0; o < 16; o++) {
|
||
|
|
let s2 = o / 16 * Math.PI * 2, l = Math.cos(s2), M = Math.sin(s2);
|
||
|
|
if (E(1, l, M)) continue;
|
||
|
|
let d = 0, x = 1;
|
||
|
|
for (let G = 0; G < 12; G++) {
|
||
|
|
let u = (d + x) / 2;
|
||
|
|
if (E(u, l, M)) d = u;
|
||
|
|
else x = u;
|
||
|
|
}
|
||
|
|
g = Math.min(g, d);
|
||
|
|
}
|
||
|
|
let S = 0, f = 0, P = a.map((o) => {
|
||
|
|
let s2 = o.getBBox();
|
||
|
|
return S = Math.max(S, s2.width / 2), f = Math.max(f, s2.height / 2), { x: s2.x + s2.width / 2 - y, y: s2.y + s2.height / 2 - m };
|
||
|
|
}), b = Math.max(1, r.width / 2 * g - S), i2 = Math.max(1, r.height / 2 * g - f), c = 0;
|
||
|
|
for (let o of P) c = Math.max(c, Math.hypot(o.x / b, o.y / i2));
|
||
|
|
if (c > 0.85) b *= c / 0.85, i2 *= c / 0.85;
|
||
|
|
return { marks: P.map((o) => ({ x: o.x / b, y: o.y / i2 })), rx: b, ry: i2 };
|
||
|
|
} catch {
|
||
|
|
return null;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
function Me(e, n = {}) {
|
||
|
|
let a = matchMedia("(hover: hover) and (pointer: fine)"), r = matchMedia("(prefers-reduced-motion: reduce)"), h = n.settle ?? 110, y = n.snap ?? 1.6, m = 0, E = 0, g = 1, S = 1, f = 0, P = -1e6, b = -1e6, i2 = 0, c = 0, o = 0, s2 = 0, l = 0, M = 0, d = 0, x = 0, G = false, u = false, v = null, k = null, N = false, B = 1, p2 = e, R = [], _ = [], X = 50, C = 50, Z = 0, U = 0, Y = () => {
|
||
|
|
let t = ye(e);
|
||
|
|
if (!t) return;
|
||
|
|
_ = t.marks, X = t.rx, C = t.ry;
|
||
|
|
}, J = () => {
|
||
|
|
p2 = e.querySelector(".mo-eyes") ?? e, R = [...e.querySelectorAll(".mo-eye")], Y();
|
||
|
|
}, K = () => {
|
||
|
|
if (!k) return;
|
||
|
|
let t = k.getBoundingClientRect();
|
||
|
|
v = { x: t.left + t.width / 2, y: t.top + t.height / 2 };
|
||
|
|
}, j = () => {
|
||
|
|
K();
|
||
|
|
let t = e.getBoundingClientRect();
|
||
|
|
if (m = t.left + t.width / 2, E = t.top + t.height / 2, g = Math.max(1, Math.min(t.width, t.height) / 2), S = Math.max(1, t.width), f = parseFloat(getComputedStyle(p2).getPropertyValue("--mo-track-travel")) || 0, !_.length) Y();
|
||
|
|
Z = f / X, U = f / C;
|
||
|
|
}, Q = (t) => {
|
||
|
|
x = 0;
|
||
|
|
let H = d ? Math.min(t - d, 64) : 16;
|
||
|
|
if (d = t, !p2.isConnected) J(), j(), o = s2 = 1 / 0;
|
||
|
|
let re = ie(H, h), L = he({ x: i2, y: c, dx: N ? 0 : (v ? v.x : P) - m, dy: N ? 0 : (v ? v.y : b) - E, radius: g, k: re, snap: y });
|
||
|
|
i2 = L.x, c = L.y;
|
||
|
|
let O = le(S, f), V = false;
|
||
|
|
if (Math.abs(L.tx - i2) <= O && Math.abs(L.ty - c) <= O) i2 = L.tx, c = L.ty;
|
||
|
|
else V = true;
|
||
|
|
if (l += (B - l) * re, Math.abs(B - l) <= 0.01) l = B;
|
||
|
|
else V = true;
|
||
|
|
if (Math.abs(l - M) > 0.01) M = l, e.style.setProperty("--mo-track-hold", l.toFixed(3)), V = true;
|
||
|
|
if (Math.abs(i2 - o) > O || Math.abs(c - s2) > O) {
|
||
|
|
o = i2, s2 = c, p2.style.setProperty("--mo-track-x", i2.toFixed(3)), p2.style.setProperty("--mo-track-y", c.toFixed(3));
|
||
|
|
for (let I = 0; I < _.length && I < R.length; I++) {
|
||
|
|
let T2 = ue(_[I], i2 * Z, c * U), q = I + 1;
|
||
|
|
p2.style.setProperty(`--mo-gz-dx${q}`, (T2.dx * X).toFixed(3)), p2.style.setProperty(`--mo-gz-dy${q}`, (T2.dy * C).toFixed(3)), p2.style.setProperty(`--mo-gz-sx${q}`, T2.sx.toFixed(4)), p2.style.setProperty(`--mo-gz-sy${q}`, T2.sy.toFixed(4)), p2.style.setProperty(`--mo-gz-t${q}`, T2.t.toFixed(3));
|
||
|
|
}
|
||
|
|
V = true;
|
||
|
|
}
|
||
|
|
if (V || G) G = false, x = requestAnimationFrame(Q);
|
||
|
|
else d = 0;
|
||
|
|
}, w = () => {
|
||
|
|
if (!u) return;
|
||
|
|
if (G = true, !x) x = requestAnimationFrame(Q);
|
||
|
|
}, W = (t) => {
|
||
|
|
P = t.clientX, b = t.clientY, w();
|
||
|
|
}, ee = () => {
|
||
|
|
P = -1e6, b = -1e6, w();
|
||
|
|
}, z2 = () => {
|
||
|
|
j(), w();
|
||
|
|
}, A = new ResizeObserver(z2), se = () => {
|
||
|
|
if (u) return;
|
||
|
|
if (u = true, J(), j(), A.observe(e), k) A.observe(k);
|
||
|
|
addEventListener("pointermove", W, { passive: true }), addEventListener("pointerleave", ee, { passive: true }), addEventListener("scroll", z2, { passive: true, capture: true }), addEventListener("resize", z2, { passive: true }), w();
|
||
|
|
}, te = () => {
|
||
|
|
if (!u) return;
|
||
|
|
if (u = false, A.disconnect(), removeEventListener("pointermove", W), removeEventListener("pointerleave", ee), removeEventListener("scroll", z2, { capture: true }), removeEventListener("resize", z2), x) cancelAnimationFrame(x);
|
||
|
|
x = 0, d = 0, i2 = c = o = s2 = l = M = 0, p2.style.removeProperty("--mo-track-x"), p2.style.removeProperty("--mo-track-y");
|
||
|
|
for (let t = 1; t <= R.length; t++) for (let H of ["dx", "dy", "sx", "sy", "t"]) p2.style.removeProperty(`--mo-gz-${H}${t}`);
|
||
|
|
e.style.removeProperty("--mo-track-hold");
|
||
|
|
}, F = () => a.matches && !r.matches ? se() : te();
|
||
|
|
a.addEventListener("change", F), r.addEventListener("change", F), F();
|
||
|
|
let ne = (t) => {
|
||
|
|
if (k && u) A.unobserve(k);
|
||
|
|
if (k = v = null, N = t === null || t === "rest", B = t === null ? 0 : 1, typeof t !== "object" || !t) return;
|
||
|
|
if ("getBoundingClientRect" in t) {
|
||
|
|
if (k = t, u) A.observe(t);
|
||
|
|
K();
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
v = { x: t.x, y: t.y };
|
||
|
|
};
|
||
|
|
return ne(n.target ?? null), { lookAt: (t) => {
|
||
|
|
ne(t), w();
|
||
|
|
}, remeasure: z2, stop: () => {
|
||
|
|
te(), a.removeEventListener("change", F), r.removeEventListener("change", F);
|
||
|
|
} };
|
||
|
|
}
|
||
|
|
|
||
|
|
// node_modules/@blobatar/react/dist/gaze.js
|
||
|
|
function T({ settle: a, snap: l, travel: o, lookAt: e } = {}) {
|
||
|
|
let [t, m] = (0, import_react.useState)(null), r = (0, import_react.useRef)(null), G = (0, import_react.useRef)(null);
|
||
|
|
(0, import_react.useEffect)(() => {
|
||
|
|
if (!t || !(t instanceof SVGSVGElement)) return;
|
||
|
|
let n = Me(t, { settle: a, snap: l, target: G.current });
|
||
|
|
return r.current = n, () => {
|
||
|
|
r.current = null, n.stop();
|
||
|
|
};
|
||
|
|
}, [t, a, l]), (0, import_react.useEffect)(() => {
|
||
|
|
var _a;
|
||
|
|
if (!t || o === void 0) return;
|
||
|
|
return t.style.setProperty("--mo-track-travel", `${o}px`), (_a = r.current) == null ? void 0 : _a.remeasure(), () => {
|
||
|
|
t.style.removeProperty("--mo-track-travel");
|
||
|
|
};
|
||
|
|
}, [t, o]);
|
||
|
|
let u = (0, import_react.useCallback)((n) => {
|
||
|
|
var _a;
|
||
|
|
G.current = n, (_a = r.current) == null ? void 0 : _a.lookAt(n);
|
||
|
|
}, []), c = e && typeof e === "object" && "x" in e ? `${e.x},${e.y}` : e;
|
||
|
|
(0, import_react.useEffect)(() => {
|
||
|
|
if (e !== void 0) u(e);
|
||
|
|
}, [u, c]);
|
||
|
|
let f = (0, import_react.useCallback)(() => {
|
||
|
|
var _a;
|
||
|
|
(_a = r.current) == null ? void 0 : _a.remeasure();
|
||
|
|
}, []);
|
||
|
|
return { ref: m, lookAt: u, remeasure: f };
|
||
|
|
}
|
||
|
|
export {
|
||
|
|
T as useGaze
|
||
|
|
};
|
||
|
|
//# sourceMappingURL=@blobatar_react_gaze.js.map
|