react-two.js 0.8.22-r.4 → 0.8.22-r.5

package/dist/react-two-main.es.js

@@ -1,34 +1,34 @@
-import { jsx as S, Fragment as G } from "react/jsx-runtime";
-import k, { createContext as Q, useContext as J, useRef as q, useEffect as h, useState as W, useCallback as oe, useMemo as g, useImperativeHandle as C } from "react";
+import { jsx as E, Fragment as T } from "react/jsx-runtime";
+import k, { createContext as Z, useContext as X, useRef as A, useEffect as h, useState as $, useCallback as oe, useMemo as g, useImperativeHandle as R } from "react";
 import H from "two.js";
-const X = Q({
+const ee = Z({
   two: null,
   registerEventShape: () => {
   },
   unregisterEventShape: () => {
   }
-}), _ = Q({
+}), J = Z({
   parent: null
-}), B = Q({
+}), Q = Z({
   width: 0,
   height: 0
-}), ae = X, j = () => {
-  const t = J(X), i = J(_), r = J(B);
-  return { ...t, ...i, ...r };
-}, ve = (t, i = []) => {
-  const { two: r } = j(), f = q(t);
+}), ce = ee, C = () => {
+  const t = X(ee), s = X(J), r = X(Q);
+  return { ...t, ...s, ...r };
+}, ve = (t, s = []) => {
+  const { two: r } = C(), l = A(t);
   h(() => {
-    f.current = t;
-  }, [t, ...i]), h(() => {
+    l.current = t;
+  }, [t, ...s]), h(() => {
     if (!r)
       return;
     let n = 0;
     return r.bind("update", u), () => r.unbind("update", u);
-    function u(c, e) {
-      n += e / 1e3, f.current?.(n, e);
+    function u(a, e) {
+      n += e / 1e3, l.current?.(n, e);
     }
-  }, [r, ...i]);
-}, L = [
+  }, [r, ...s]);
+}, O = [
   "onClick",
   "onContextMenu",
   "onDoubleClick",
@@ -42,21 +42,21 @@ const X = Q({
   "onPointerMove",
   "onPointerCancel"
 ];
-function ie(t, i, r) {
-  const f = i.getBoundingClientRect(), n = t.clientX - f.left - r.width / 2, u = t.clientY - f.top - r.height / 2;
+function ie(t, s, r) {
+  const l = s.getBoundingClientRect(), n = t.clientX - l.left - r.width / 2, u = t.clientY - l.top - r.height / 2;
   return { x: n, y: u };
 }
-function N(t, i) {
-  const r = i.getBoundingClientRect(), f = t.clientX - r.left, n = t.clientY - r.top;
-  return { x: f, y: n };
+function U(t, s) {
+  const r = s.getBoundingClientRect(), l = t.clientX - r.left, n = t.clientY - r.top;
+  return { x: l, y: n };
 }
-function se(t, i, r, f) {
+function se(t, s, r, l) {
   let n = !1;
   return {
     nativeEvent: t,
-    target: i,
+    target: s,
     currentTarget: r,
-    point: f,
+    point: l,
     stopPropagation: () => {
       n = !0;
     },
@@ -65,29 +65,29 @@ function se(t, i, r, f) {
     }
   };
 }
-function ce(t, i, r) {
-  return "visible" in t && !t.visible ? !1 : typeof t.contains == "function" ? t.contains(i, r) : !1;
+function ae(t, s, r) {
+  return "visible" in t && !t.visible ? !1 : typeof t.contains == "function" ? t.contains(s, r) : !1;
 }
-function A(t, i, r) {
-  const f = [];
+function q(t, s, r) {
+  const l = [];
   for (const [n] of t)
-    ce(n, i, r) && f.push(n);
-  return f;
+    ae(n, s, r) && l.push(n);
+  return l;
 }
-function fe(t, i) {
-  const r = [t], f = i.get(t);
-  if (f?.parent) {
-    let n = f.parent;
+function le(t, s) {
+  const r = [t], l = s.get(t);
+  if (l?.parent) {
+    let n = l.parent;
     for (; n; )
-      r.push(n), n = i.get(n)?.parent;
+      r.push(n), n = s.get(n)?.parent;
   }
   return r;
 }
-function K(t) {
-  process.env.NODE_ENV !== "production" && k.Children.forEach(t, (i) => {
-    if (!k.isValidElement(i))
+function Y(t) {
+  process.env.NODE_ENV !== "production" && k.Children.forEach(t, (s) => {
+    if (!k.isValidElement(s))
       return;
-    const r = i.type;
+    const r = s.type;
     if (typeof r == "string") {
       console.warn(
         `[react-two.js] <${r}> is not compatible with Canvas.
@@ -98,383 +98,396 @@ See: https://github.com/jonobr1/react-two.js#usage`
       return;
     }
     if (r === k.Fragment) {
-      K(
-        i.props.children
+      Y(
+        s.props.children
       );
       return;
     }
-    typeof r == "function" && i.props.children && K(
-      i.props.children
+    typeof r == "function" && s.props.children && Y(
+      s.props.children
     );
   });
 }
 const pe = (t) => {
-  const { two: i, parent: r } = j(), f = q(null), n = q(/* @__PURE__ */ new Map()), u = q(/* @__PURE__ */ new Set()), c = q(null), [e, s] = W(i), [a, o] = W(r), [d, l] = W(0), [v, p] = W(0), O = oe(
-    (m, w, y) => {
-      n.current.set(m, { shape: m, handlers: w, parent: y });
+  const { two: s, parent: r } = C(), l = A(null), n = A(/* @__PURE__ */ new Map()), u = A(/* @__PURE__ */ new Set()), a = A(null), [e, o] = $(s), [c, i] = $(r), [d, f] = $(0), [v, p] = $(0), j = oe(
+    (m, S, b) => {
+      n.current.set(m, { shape: m, handlers: S, parent: b });
     },
     []
-  ), V = oe((m) => {
-    n.current.delete(m), u.current.delete(m), c.current === m && (c.current = null);
+  ), M = oe((m) => {
+    n.current.delete(m), u.current.delete(m), a.current === m && (a.current = null);
   }, []);
   h(() => {
-    if (!i) {
-      const w = { ...t };
-      delete w.children;
-      const y = new H(w).appendTo(f.current);
-      return s(y), o(y.scene), l(y.width), p(y.height), () => {
-        y.renderer.domElement.parentElement?.removeChild(
-          y.renderer.domElement
-        ), y.pause(), y.unbind(), y.release();
-        const R = H.Instances.indexOf(y);
-        R >= 0 && H.Instances.splice(R, 1), y.clear();
+    if (!s) {
+      const S = { ...t };
+      delete S.children;
+      const b = new H(S).appendTo(l.current);
+      return o(b), i(b.scene), f(b.width), p(b.height), () => {
+        b.renderer.domElement.parentElement?.removeChild(
+          b.renderer.domElement
+        ), b.pause(), b.unbind(), b.release();
+        const I = H.Instances.indexOf(b);
+        I >= 0 && H.Instances.splice(I, 1), b.clear();
       };
     }
   }, []), h(() => {
-    !i && (typeof t.width == "number" && (e && (e.width = t.width), l(t.width)), typeof t.height == "number" && (e && (e.height = t.height), p(t.height)));
-  }, [i, e, t.width, t.height]), h(() => {
-    if (!i && e) {
-      let w = function() {
-        const F = y.width !== R, z = y.height !== M;
-        F && (R = y.width), z && (M = y.height), (F || z) && (l(R), p(M));
+    !s && (typeof t.width == "number" && (e && (e.width = t.width), f(t.width)), typeof t.height == "number" && (e && (e.height = t.height), p(t.height)));
+  }, [s, e, t.width, t.height]), h(() => {
+    if (!s && e) {
+      let S = function() {
+        const V = b.width !== I, G = b.height !== L;
+        V && (I = b.width), G && (L = b.height), (V || G) && (f(I), p(L));
       };
-      const y = e;
-      let R = y.width, M = y.height;
-      return (t.fullscreen || t.fitted) && y.bind("update", w), () => {
-        y.unbind("update", w);
+      const b = e;
+      let I = b.width, L = b.height;
+      return (t.fullscreen || t.fitted) && b.bind("update", S), () => {
+        b.unbind("update", S);
       };
     }
-  }, [i, e, t.fullscreen, t.fitted]), h(() => {
-    process.env.NODE_ENV !== "production" && K(t.children);
+  }, [s, e, t.fullscreen, t.fitted]), h(() => {
+    process.env.NODE_ENV !== "production" && Y(t.children);
   }, [t.children]), h(() => {
     if (!e) return;
-    const m = e.renderer.domElement, w = (P, E, b) => {
-      if (P.length === 0) return;
-      const D = P[0], U = ie(b, m, e), x = fe(D, n.current);
-      for (const ne of x) {
-        const te = n.current.get(ne)?.handlers[E];
+    const m = e.renderer.domElement, S = (y, w, P) => {
+      if (y.length === 0) return;
+      const N = y[0], B = ie(P, m, e), F = le(N, n.current);
+      for (const ne of F) {
+        const te = n.current.get(ne)?.handlers[w];
         if (te) {
           const re = se(
-            b,
-            D,
+            P,
+            N,
             ne,
-            U
+            B
           );
           if (te(re), re.stopped)
             break;
         }
       }
-    }, y = (P) => {
-      const E = N(P, m), b = A(
+    }, b = (y) => {
+      const w = U(y, m), P = q(
         n.current,
-        E.x,
-        E.y
+        w.x,
+        w.y
       );
-      b.length > 0 && w(b, "onClick", P);
-    }, R = (P) => {
-      const E = N(P, m), b = A(
+      P.length > 0 && S(P, "onClick", y);
+    }, I = (y) => {
+      const w = U(y, m), P = q(
         n.current,
-        E.x,
-        E.y
+        w.x,
+        w.y
       );
-      b.length > 0 && w(b, "onContextMenu", P);
-    }, M = (P) => {
-      const E = N(P, m), b = A(
+      P.length > 0 && S(P, "onContextMenu", y);
+    }, L = (y) => {
+      const w = U(y, m), P = q(
         n.current,
-        E.x,
-        E.y
+        w.x,
+        w.y
       );
-      b.length > 0 && w(b, "onDoubleClick", P);
-    }, F = (P) => {
-      const E = N(P, m), b = A(
+      P.length > 0 && S(P, "onDoubleClick", y);
+    }, V = (y) => {
+      const w = U(y, m), P = q(
         n.current,
-        E.x,
-        E.y
+        w.x,
+        w.y
       );
-      b.length > 0 && w(b, "onWheel", P);
-    }, z = (P) => {
-      const E = N(P, m), b = A(
+      P.length > 0 && S(P, "onWheel", y);
+    }, G = (y) => {
+      const w = U(y, m), P = q(
         n.current,
-        E.x,
-        E.y
+        w.x,
+        w.y
       );
-      b.length > 0 && (w(b, "onPointerDown", P), P.target instanceof Element && P.target.hasPointerCapture?.(P.pointerId) && (c.current = b[0]));
-    }, Y = (P) => {
-      if (c.current) {
-        const D = n.current.get(c.current);
-        if (D?.handlers.onPointerUp) {
-          const U = ie(P, m, e), x = se(
-            P,
-            c.current,
-            c.current,
-            U
+      P.length > 0 && (S(P, "onPointerDown", y), y.target instanceof Element && y.target.hasPointerCapture?.(y.pointerId) && (a.current = P[0]));
+    }, _ = (y) => {
+      if (a.current) {
+        const N = n.current.get(a.current);
+        if (N?.handlers.onPointerUp) {
+          const B = ie(y, m, e), F = se(
+            y,
+            a.current,
+            a.current,
+            B
           );
-          D.handlers.onPointerUp(x);
+          N.handlers.onPointerUp(F);
         }
-        c.current = null;
+        a.current = null;
         return;
       }
-      const E = N(P, m), b = A(
+      const w = U(y, m), P = q(
         n.current,
-        E.x,
-        E.y
+        w.x,
+        w.y
       );
-      b.length > 0 ? w(b, "onPointerUp", P) : t.onPointerMissed && t.onPointerMissed(P);
-    }, Z = (P) => {
-      const E = N(P, m), b = A(
+      P.length > 0 ? S(P, "onPointerUp", y) : t.onPointerMissed && t.onPointerMissed(y);
+    }, z = (y) => {
+      const w = U(y, m), P = q(
         n.current,
-        E.x,
-        E.y
-      ), D = new Set(b);
-      b.length > 0 && w(b, "onPointerMove", P);
-      const U = u.current;
-      for (const x of D)
-        U.has(x) || (w([x], "onPointerEnter", P), w([x], "onPointerOver", P));
-      for (const x of U)
-        D.has(x) || (w([x], "onPointerLeave", P), w([x], "onPointerOut", P));
-      u.current = D;
-    }, ee = (P) => {
-      const E = N(P, m), b = A(
+        w.x,
+        w.y
+      ), N = new Set(P);
+      P.length > 0 && S(P, "onPointerMove", y);
+      const B = u.current;
+      for (const F of N)
+        B.has(F) || (S([F], "onPointerEnter", y), S([F], "onPointerOver", y));
+      for (const F of B)
+        N.has(F) || (S([F], "onPointerLeave", y), S([F], "onPointerOut", y));
+      u.current = N;
+    }, W = (y) => {
+      const w = U(y, m), P = q(
         n.current,
-        E.x,
-        E.y
+        w.x,
+        w.y
       );
-      b.length > 0 && w(b, "onPointerCancel", P), c.current = null;
+      P.length > 0 && S(P, "onPointerCancel", y), a.current = null;
     };
-    return m.addEventListener("click", y), m.addEventListener("contextmenu", R), m.addEventListener("dblclick", M), m.addEventListener("wheel", F), m.addEventListener("pointerdown", z), m.addEventListener("pointerup", Y), m.addEventListener("pointermove", Z), m.addEventListener("pointercancel", ee), () => {
-      m.removeEventListener("click", y), m.removeEventListener("contextmenu", R), m.removeEventListener("dblclick", M), m.removeEventListener("wheel", F), m.removeEventListener("pointerdown", z), m.removeEventListener("pointerup", Y), m.removeEventListener("pointermove", Z), m.removeEventListener("pointercancel", ee);
+    return m.addEventListener("click", b), m.addEventListener("contextmenu", I), m.addEventListener("dblclick", L), m.addEventListener("wheel", V), m.addEventListener("pointerdown", G), m.addEventListener("pointerup", _), m.addEventListener("pointermove", z), m.addEventListener("pointercancel", W), () => {
+      m.removeEventListener("click", b), m.removeEventListener("contextmenu", I), m.removeEventListener("dblclick", L), m.removeEventListener("wheel", V), m.removeEventListener("pointerdown", G), m.removeEventListener("pointerup", _), m.removeEventListener("pointermove", z), m.removeEventListener("pointercancel", W);
     };
   }, [
     e,
     t.onPointerMissed,
-    O,
-    V
+    j,
+    M
   ]);
-  const T = g(
+  const x = g(
     () => ({
       two: e,
-      registerEventShape: O,
-      unregisterEventShape: V
+      registerEventShape: j,
+      unregisterEventShape: M
     }),
     [
       e,
-      O,
-      V
+      j,
+      M
     ]
-  ), I = g(
+  ), D = g(
     () => ({
-      parent: a
+      parent: c
     }),
-    [a]
-  ), $ = g(
+    [c]
+  ), K = g(
     () => ({
       width: d,
       height: v
     }),
     [d, v]
   );
-  return /* @__PURE__ */ S(X.Provider, { value: T, children: /* @__PURE__ */ S(_.Provider, { value: I, children: /* @__PURE__ */ S(B.Provider, { value: $, children: /* @__PURE__ */ S("div", { ref: f, children: t.children }) }) }) });
+  return /* @__PURE__ */ E(ee.Provider, { value: x, children: /* @__PURE__ */ E(J.Provider, { value: D, children: /* @__PURE__ */ E(Q.Provider, { value: K, children: /* @__PURE__ */ E("div", { ref: l, children: t.children }) }) }) });
 }, ge = k.forwardRef(
-  ({ x: t, y: i, ...r }, f) => {
+  ({ x: t, y: s, ...r }, l) => {
     const {
       two: n,
       parent: u,
-      width: c,
+      width: a,
       height: e,
-      registerEventShape: s,
-      unregisterEventShape: a
-    } = j(), o = g(() => new H.Group(), []), { eventHandlers: d, shapeProps: l } = g(() => {
-      const V = {}, T = {};
-      for (const I in r)
-        L.includes(I) ? V[I] = r[
-          I
+      registerEventShape: o,
+      unregisterEventShape: c
+    } = C(), i = g(() => new H.Group(), []), { eventHandlers: d, shapeProps: f } = g(() => {
+      const M = {}, x = {};
+      for (const D in r)
+        O.includes(D) ? M[D] = r[
+          D
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ] : T[I] = r[I];
-      return { eventHandlers: V, shapeProps: T };
+        ] : x[D] = r[D];
+      return { eventHandlers: M, shapeProps: x };
     }, [r]);
     h(() => {
       if (u)
-        return u.add(o), () => {
-          u.remove(o);
-        };
-    }, [u, o]), h(() => {
-      typeof t == "number" && (o.translation.x = t), typeof i == "number" && (o.translation.y = i);
-      const V = { ...l };
-      delete V.children;
-      for (const T in V)
-        T in o && (o[T] = V[T]);
-    }, [o, t, i, l]), h(() => {
+        return u.add(i), () => {
+          u.remove(i);
+        };
+    }, [u, i]), h(() => {
+      typeof t == "number" && (i.translation.x = t), typeof s == "number" && (i.translation.y = s);
+      const M = { ...f };
+      delete M.children;
+      for (const x in M)
+        x in i && (i[x] = M[x]);
+    }, [i, t, s, f]), h(() => {
       if (Object.keys(d).length > 0)
-        return s(o, d, u ?? void 0), () => {
-          a(o);
+        return o(i, d, u ?? void 0), () => {
+          c(i);
         };
     }, [
+      i,
       o,
-      s,
-      a,
+      c,
       u,
       d
-    ]), C(f, () => o, [o]);
+    ]), R(l, () => i, [i]);
     const v = g(
       () => ({
         two: n,
-        registerEventShape: s,
-        unregisterEventShape: a
+        registerEventShape: o,
+        unregisterEventShape: c
       }),
-      [n, s, a]
+      [n, o, c]
     ), p = g(
       () => ({
-        parent: o
+        parent: i
       }),
-      [o]
-    ), O = g(
+      [i]
+    ), j = g(
       () => ({
-        width: c,
+        width: a,
         height: e
       }),
-      [c, e]
+      [a, e]
     );
-    return /* @__PURE__ */ S(ae.Provider, { value: v, children: /* @__PURE__ */ S(_.Provider, { value: p, children: /* @__PURE__ */ S(B.Provider, { value: O, children: r.children }) }) });
+    return /* @__PURE__ */ E(ce.Provider, { value: v, children: /* @__PURE__ */ E(J.Provider, { value: p, children: /* @__PURE__ */ E(Q.Provider, { value: j, children: r.children }) }) });
   }
-), me = k.forwardRef(
-  ({ x: t, y: i, src: r, content: f, onLoad: n, onError: u, ...c }, e) => {
+), ye = k.forwardRef(
+  ({ x: t, y: s, src: r, content: l, onLoad: n, onError: u, ...a }, e) => {
     const {
-      two: s,
-      parent: a,
-      width: o,
+      two: o,
+      parent: c,
+      width: i,
       height: d,
-      registerEventShape: l,
+      registerEventShape: f,
       unregisterEventShape: v
-    } = j(), p = g(() => new H.Group(), []), O = q(null), { eventHandlers: V, shapeProps: T } = g(() => {
-      const w = {}, y = {};
-      for (const R in c)
-        L.includes(R) ? w[R] = c[
-          R
+    } = C(), p = g(() => new H.Group(), []), j = A(null), M = A(n), x = A(u), D = A({ two: null, key: null });
+    h(() => {
+      M.current = n;
+    }, [n]), h(() => {
+      x.current = u;
+    }, [u]);
+    const { eventHandlers: K, shapeProps: m } = g(() => {
+      const L = {}, V = {};
+      for (const G in a)
+        O.includes(G) ? L[G] = a[
+          G
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ] : y[R] = c[R];
-      return { eventHandlers: w, shapeProps: y };
-    }, [c]);
+        ] : V[G] = a[G];
+      return { eventHandlers: L, shapeProps: V };
+    }, [a]);
     h(() => {
-      O.current = p;
+      j.current = p;
     }, [p]), h(() => {
-      if (a && p)
-        return a.add(p), () => {
-          a.remove(p);
+      if (c && p)
+        return c.add(p), () => {
+          c.remove(p);
         };
-    }, [p, a]), h(() => {
-      !r && !f && console.warn(
+    }, [p, c]), h(() => {
+      !r && !l && console.warn(
         '[react-two.js] SVG component requires either "src" or "content" prop'
-      ), r && f && console.warn(
+      ), r && l && console.warn(
         '[react-two.js] SVG component has both "src" and "content" props. Using "src" and ignoring "content"'
       );
-    }, [r, f]), h(() => {
-      if (!s) return;
-      const w = r || f;
-      if (!w) return;
-      let y = !0;
+    }, [r, l]), h(() => {
+      if (!o) return;
+      const L = r || l;
+      if (!L) return;
+      const V = L, G = D.current;
+      if (G.two === o && G.key === V)
+        return;
+      let _ = !0;
+      D.current = { two: o, key: V };
       try {
-        s.load(
-          w,
-          (R, M) => {
-            if (y && (O.current?.add(R.children), n))
+        o.load(
+          L,
+          (z, W) => {
+            if (!_) return;
+            j.current?.add(z.children);
+            const y = M.current;
+            if (y)
               try {
-                requestAnimationFrame(() => n(O.current, M));
-              } catch (F) {
+                requestAnimationFrame(() => y(j.current, W));
+              } catch (w) {
                 console.error(
                   "[react-two.js] Error in SVG onLoad callback:",
-                  F
+                  w
                 );
               }
           }
         );
-      } catch (R) {
-        if (!y) return;
-        const M = R instanceof Error ? R : new Error("Failed to load SVG");
-        if (u)
+      } catch (z) {
+        if (!_) return;
+        const W = z instanceof Error ? z : new Error("Failed to load SVG"), y = x.current;
+        if (y)
           try {
-            u(M);
-          } catch (F) {
+            y(W);
+          } catch (w) {
             console.error(
               "[react-two.js] Error in SVG onError callback:",
-              F
+              w
             );
           }
         else
-          console.error("[react-two.js] SVG loading error:", M);
+          console.error("[react-two.js] SVG loading error:", W);
       }
       return () => {
-        y = !1, O.current?.remove(O.current.children);
+        _ = !1, D.current = { two: null, key: null }, j.current?.remove(j.current.children);
       };
-    }, [s, r, f, n, u]), h(() => {
-      typeof t == "number" && (p.translation.x = t), typeof i == "number" && (p.translation.y = i);
-      const w = { ...T };
-      delete w.children;
-      for (const y in w)
-        y in p && (p[y] = w[y]);
-    }, [p, t, i, T]), h(() => {
-      if (Object.keys(V).length > 0)
-        return l(p, V, a ?? void 0), () => {
+    }, [o, r, l]), h(() => {
+      typeof t == "number" && (p.translation.x = t), typeof s == "number" && (p.translation.y = s);
+      const L = { ...m };
+      delete L.children;
+      for (const V in L)
+        V in p && (p[V] = L[V]);
+    }, [p, t, s, m]), h(() => {
+      if (Object.keys(K).length > 0)
+        return f(p, K, c ?? void 0), () => {
           v(p);
         };
-    }, [p, l, v, a, V]), C(e, () => p, [p]);
-    const I = g(
+    }, [p, f, v, c, K]), R(e, () => p, [p]);
+    const S = g(
       () => ({
-        two: s,
-        registerEventShape: l,
+        two: o,
+        registerEventShape: f,
         unregisterEventShape: v
       }),
-      [s, l, v]
-    ), $ = g(
+      [o, f, v]
+    ), b = g(
       () => ({
         parent: p
       }),
       [p]
-    ), m = g(
+    ), I = g(
       () => ({
-        width: o,
+        width: i,
         height: d
       }),
-      [o, d]
+      [i, d]
     );
-    return /* @__PURE__ */ S(ae.Provider, { value: I, children: /* @__PURE__ */ S(_.Provider, { value: $, children: /* @__PURE__ */ S(B.Provider, { value: m, children: c.children }) }) });
+    return /* @__PURE__ */ E(ce.Provider, { value: S, children: /* @__PURE__ */ E(J.Provider, { value: b, children: /* @__PURE__ */ E(Q.Provider, { value: I, children: a.children }) }) });
   }
-), ye = k.forwardRef(
-  ({ manual: t, x: i, y: r, ...f }, n) => {
-    const { parent: u, registerEventShape: c, unregisterEventShape: e } = j(), s = g(() => new H.Path(), []), { eventHandlers: a, shapeProps: o } = g(() => {
-      const d = {}, l = {};
-      for (const v in f)
-        L.includes(v) ? d[v] = f[
+), me = k.forwardRef(
+  ({ manual: t, x: s, y: r, ...l }, n) => {
+    const { parent: u, registerEventShape: a, unregisterEventShape: e } = C(), o = g(() => new H.Path(), []), { eventHandlers: c, shapeProps: i } = g(() => {
+      const d = {}, f = {};
+      for (const v in l)
+        O.includes(v) ? d[v] = l[
           v
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ] : l[v] = f[v];
-      return { eventHandlers: d, shapeProps: l };
-    }, [f]);
+        ] : f[v] = l[v];
+      return { eventHandlers: d, shapeProps: f };
+    }, [l]);
     return h(() => {
       if (u)
-        return u.add(s), () => {
-          u.remove(s);
-        };
-    }, [u, s]), h(() => {
-      if (Object.keys(a).length > 0)
-        return c(s, a, u ?? void 0), () => {
-          e(s);
-        };
-    }, [s, c, e, u, a]), h(() => {
-      typeof i == "number" && (s.translation.x = i), typeof r == "number" && (s.translation.y = r), typeof t < "u" && (s.automatic = !t);
-      for (const d in o)
-        d in s && (s[d] = o[d]);
-    }, [o, s, i, r, t]), C(n, () => s, [s]), /* @__PURE__ */ S(G, {});
+        return u.add(o), () => {
+          u.remove(o);
+        };
+    }, [u, o]), h(() => {
+      if (Object.keys(c).length > 0)
+        return a(o, c, u ?? void 0), () => {
+          e(o);
+        };
+    }, [o, a, e, u, c]), h(() => {
+      typeof s == "number" && (o.translation.x = s), typeof r == "number" && (o.translation.y = r), typeof t < "u" && (o.automatic = !t);
+      for (const d in i)
+        d in o && (o[d] = i[d]);
+    }, [i, o, s, r, t]), R(n, () => o, [o]), /* @__PURE__ */ E(T, {});
   }
-), Pe = k.forwardRef(
-  ({ x: t, y: i, ...r }, f) => {
-    const { parent: n, registerEventShape: u, unregisterEventShape: c } = j(), e = g(() => new H.Points(), []), { eventHandlers: s, shapeProps: a } = g(() => {
-      const o = {}, d = {};
-      for (const l in r)
-        L.includes(l) ? o[l] = r[
-          l
+), we = k.forwardRef(
+  ({ x: t, y: s, ...r }, l) => {
+    const { parent: n, registerEventShape: u, unregisterEventShape: a } = C(), e = g(() => new H.Points(), []), { eventHandlers: o, shapeProps: c } = g(() => {
+      const i = {}, d = {};
+      for (const f in r)
+        O.includes(f) ? i[f] = r[
+          f
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ] : d[l] = r[l];
-      return { eventHandlers: o, shapeProps: d };
+        ] : d[f] = r[f];
+      return { eventHandlers: i, shapeProps: d };
     }, [r]);
     return h(() => {
       if (n)
@@ -482,32 +495,32 @@ const pe = (t) => {
           n.remove(e);
         };
     }, [n, e]), h(() => {
-      typeof t == "number" && (e.translation.x = t), typeof i == "number" && (e.translation.y = i);
-      for (const o in a)
-        o in e && (e[o] = a[o]);
-    }, [a, e, t, i]), h(() => {
-      if (Object.keys(s).length > 0)
-        return u(e, s, n ?? void 0), () => {
-          c(e);
+      typeof t == "number" && (e.translation.x = t), typeof s == "number" && (e.translation.y = s);
+      for (const i in c)
+        i in e && (e[i] = c[i]);
+    }, [c, e, t, s]), h(() => {
+      if (Object.keys(o).length > 0)
+        return u(e, o, n ?? void 0), () => {
+          a(e);
         };
     }, [
       e,
       u,
-      c,
+      a,
       n,
-      s
-    ]), C(f, () => e, [e]), /* @__PURE__ */ S(G, {});
+      o
+    ]), R(l, () => e, [e]), /* @__PURE__ */ E(T, {});
   }
-), we = k.forwardRef(
-  ({ x: t, y: i, ...r }, f) => {
-    const { parent: n, registerEventShape: u, unregisterEventShape: c } = j(), e = g(() => new H.Text(), []), { eventHandlers: s, shapeProps: a } = g(() => {
-      const o = {}, d = {};
-      for (const l in r)
-        L.includes(l) ? o[l] = r[
-          l
+), Pe = k.forwardRef(
+  ({ x: t, y: s, ...r }, l) => {
+    const { parent: n, registerEventShape: u, unregisterEventShape: a } = C(), e = g(() => new H.Text(), []), { eventHandlers: o, shapeProps: c } = g(() => {
+      const i = {}, d = {};
+      for (const f in r)
+        O.includes(f) ? i[f] = r[
+          f
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ] : d[l] = r[l];
-      return { eventHandlers: o, shapeProps: d };
+        ] : d[f] = r[f];
+      return { eventHandlers: i, shapeProps: d };
     }, [r]);
     return h(() => {
       if (n)
@@ -515,227 +528,227 @@ const pe = (t) => {
           n.remove(e);
         };
     }, [n, e]), h(() => {
-      typeof t == "number" && (e.translation.x = t), typeof i == "number" && (e.translation.y = i);
-      for (const o in a)
-        o in e && (e[o] = a[o]);
-    }, [a, e, t, i]), h(() => {
-      if (Object.keys(s).length > 0)
-        return u(e, s, n ?? void 0), () => {
-          c(e);
-        };
-    }, [e, u, c, n, s]), C(f, () => e, [e]), /* @__PURE__ */ S(G, {});
+      typeof t == "number" && (e.translation.x = t), typeof s == "number" && (e.translation.y = s);
+      for (const i in c)
+        i in e && (e[i] = c[i]);
+    }, [c, e, t, s]), h(() => {
+      if (Object.keys(o).length > 0)
+        return u(e, o, n ?? void 0), () => {
+          a(e);
+        };
+    }, [e, u, a, n, o]), R(l, () => e, [e]), /* @__PURE__ */ E(T, {});
   }
 ), be = k.forwardRef(
-  ({ x: t, y: i, resolution: r, ...f }, n) => {
-    const { parent: u, registerEventShape: c, unregisterEventShape: e } = j(), s = g(
+  ({ x: t, y: s, resolution: r, ...l }, n) => {
+    const { parent: u, registerEventShape: a, unregisterEventShape: e } = C(), o = g(
       () => new H.ArcSegment(0, 0, 0, 0, 0, 0, r),
       [r]
-    ), { eventHandlers: a, shapeProps: o } = g(() => {
-      const d = {}, l = {};
-      for (const v in f)
-        L.includes(v) ? d[v] = f[
+    ), { eventHandlers: c, shapeProps: i } = g(() => {
+      const d = {}, f = {};
+      for (const v in l)
+        O.includes(v) ? d[v] = l[
           v
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ] : l[v] = f[v];
-      return { eventHandlers: d, shapeProps: l };
-    }, [f]);
+        ] : f[v] = l[v];
+      return { eventHandlers: d, shapeProps: f };
+    }, [l]);
     return h(() => {
       if (u)
-        return u.add(s), () => {
-          u.remove(s);
-        };
-    }, [u, s]), h(() => {
-      typeof t == "number" && (s.translation.x = t), typeof i == "number" && (s.translation.y = i);
-      for (const d in o)
-        d in s && (s[d] = o[d]);
-    }, [o, s, t, i]), h(() => {
-      if (Object.keys(a).length > 0)
-        return c(s, a, u ?? void 0), () => {
-          e(s);
+        return u.add(o), () => {
+          u.remove(o);
+        };
+    }, [u, o]), h(() => {
+      typeof t == "number" && (o.translation.x = t), typeof s == "number" && (o.translation.y = s);
+      for (const d in i)
+        d in o && (o[d] = i[d]);
+    }, [i, o, t, s]), h(() => {
+      if (Object.keys(c).length > 0)
+        return a(o, c, u ?? void 0), () => {
+          e(o);
         };
     }, [
-      s,
-      c,
+      o,
+      a,
       e,
       u,
-      a
-    ]), C(n, () => s, [s]), /* @__PURE__ */ S(G, {});
+      c
+    ]), R(n, () => o, [o]), /* @__PURE__ */ E(T, {});
   }
 ), Ee = k.forwardRef(
-  ({ x: t, y: i, resolution: r, ...f }, n) => {
-    const { parent: u, registerEventShape: c, unregisterEventShape: e } = j(), s = g(
+  ({ x: t, y: s, resolution: r, ...l }, n) => {
+    const { parent: u, registerEventShape: a, unregisterEventShape: e } = C(), o = g(
       () => new H.Circle(0, 0, 0, r),
       [r]
-    ), { eventHandlers: a, shapeProps: o } = g(() => {
-      const d = {}, l = {};
-      for (const v in f)
-        L.includes(v) ? d[v] = f[
+    ), { eventHandlers: c, shapeProps: i } = g(() => {
+      const d = {}, f = {};
+      for (const v in l)
+        O.includes(v) ? d[v] = l[
           v
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ] : l[v] = f[v];
-      return { eventHandlers: d, shapeProps: l };
-    }, [f]);
+        ] : f[v] = l[v];
+      return { eventHandlers: d, shapeProps: f };
+    }, [l]);
     return h(() => {
-      typeof t == "number" && (s.translation.x = t), typeof i == "number" && (s.translation.y = i);
-      for (const d in o)
-        d in s && (s[d] = o[d]);
-    }, [s, o, t, i]), h(() => {
+      typeof t == "number" && (o.translation.x = t), typeof s == "number" && (o.translation.y = s);
+      for (const d in i)
+        d in o && (o[d] = i[d]);
+    }, [o, i, t, s]), h(() => {
       if (u)
-        return u.add(s), () => {
-          u.remove(s);
+        return u.add(o), () => {
+          u.remove(o);
         };
-    }, [u, s]), h(() => {
-      if (Object.keys(a).length > 0)
-        return c(s, a, u ?? void 0), () => {
-          e(s);
+    }, [u, o]), h(() => {
+      if (Object.keys(c).length > 0)
+        return a(o, c, u ?? void 0), () => {
+          e(o);
         };
     }, [
-      s,
-      c,
+      o,
+      a,
       e,
       u,
-      a
-    ]), C(n, () => s, [s]), /* @__PURE__ */ S(G, {});
+      c
+    ]), R(n, () => o, [o]), /* @__PURE__ */ E(T, {});
   }
 ), Se = k.forwardRef(
-  ({ x: t, y: i, resolution: r, ...f }, n) => {
-    const { parent: u, registerEventShape: c, unregisterEventShape: e } = j(), s = g(
+  ({ x: t, y: s, resolution: r, ...l }, n) => {
+    const { parent: u, registerEventShape: a, unregisterEventShape: e } = C(), o = g(
       () => new H.Ellipse(0, 0, 0, 0, r),
       [r]
-    ), { eventHandlers: a, shapeProps: o } = g(() => {
-      const d = {}, l = {};
-      for (const v in f)
-        L.includes(v) ? d[v] = f[
+    ), { eventHandlers: c, shapeProps: i } = g(() => {
+      const d = {}, f = {};
+      for (const v in l)
+        O.includes(v) ? d[v] = l[
           v
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ] : l[v] = f[v];
-      return { eventHandlers: d, shapeProps: l };
-    }, [f]);
+        ] : f[v] = l[v];
+      return { eventHandlers: d, shapeProps: f };
+    }, [l]);
     return h(() => {
       if (u)
-        return u.add(s), () => {
-          u.remove(s);
-        };
-    }, [u, s]), h(() => {
-      typeof t == "number" && (s.translation.x = t), typeof i == "number" && (s.translation.y = i);
-      for (const d in o)
-        d in s && (s[d] = o[d]);
-    }, [s, t, i, o]), h(() => {
-      if (Object.keys(a).length > 0)
-        return c(s, a, u ?? void 0), () => {
-          e(s);
+        return u.add(o), () => {
+          u.remove(o);
+        };
+    }, [u, o]), h(() => {
+      typeof t == "number" && (o.translation.x = t), typeof s == "number" && (o.translation.y = s);
+      for (const d in i)
+        d in o && (o[d] = i[d]);
+    }, [o, t, s, i]), h(() => {
+      if (Object.keys(c).length > 0)
+        return a(o, c, u ?? void 0), () => {
+          e(o);
         };
     }, [
-      s,
-      c,
+      o,
+      a,
       e,
       u,
-      a
-    ]), C(n, () => s, [s]), /* @__PURE__ */ S(G, {});
+      c
+    ]), R(n, () => o, [o]), /* @__PURE__ */ E(T, {});
   }
 ), ke = k.forwardRef(
-  ({ mode: t, src: i, texture: r, x: f, y: n, ...u }, c) => {
-    const { parent: e, registerEventShape: s, unregisterEventShape: a } = j(), o = g(() => new H.Image(i), [i]), { eventHandlers: d, shapeProps: l } = g(() => {
+  ({ mode: t, src: s, texture: r, x: l, y: n, ...u }, a) => {
+    const { parent: e, registerEventShape: o, unregisterEventShape: c } = C(), i = g(() => new H.Image(s), [s]), { eventHandlers: d, shapeProps: f } = g(() => {
       const v = {}, p = {};
-      for (const O in u)
-        L.includes(O) ? v[O] = u[
-          O
+      for (const j in u)
+        O.includes(j) ? v[j] = u[
+          j
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ] : p[O] = u[O];
+        ] : p[j] = u[j];
       return { eventHandlers: v, shapeProps: p };
     }, [u]);
     return h(() => {
       if (e)
-        return e.add(o), () => {
-          e.remove(o);
+        return e.add(i), () => {
+          e.remove(i);
         };
-    }, [e, o]), h(() => {
-      typeof t < "u" && (o.mode = t), typeof r < "u" && (o.texture = r), typeof f == "number" && (o.translation.x = f), typeof n == "number" && (o.translation.y = n);
-      for (const v in l)
-        v in o && (o[v] = l[v]);
-    }, [o, l, t, r, f, n]), h(() => {
+    }, [e, i]), h(() => {
+      typeof t < "u" && (i.mode = t), typeof r < "u" && (i.texture = r), typeof l == "number" && (i.translation.x = l), typeof n == "number" && (i.translation.y = n);
+      for (const v in f)
+        v in i && (i[v] = f[v]);
+    }, [i, f, t, r, l, n]), h(() => {
       if (Object.keys(d).length > 0)
-        return s(o, d, e ?? void 0), () => {
-          a(o);
+        return o(i, d, e ?? void 0), () => {
+          c(i);
         };
     }, [
+      i,
       o,
-      s,
-      a,
+      c,
       e,
       d
-    ]), C(c, () => o, [o]), /* @__PURE__ */ S(G, {});
+    ]), R(a, () => i, [i]), /* @__PURE__ */ E(T, {});
   }
 ), He = k.forwardRef(
-  ({ src: t, x: i, y: r, autoPlay: f, ...n }, u) => {
-    const { parent: c, registerEventShape: e, unregisterEventShape: s } = j(), a = g(() => new H.ImageSequence(t), [t]), { eventHandlers: o, shapeProps: d } = g(() => {
-      const l = {}, v = {};
+  ({ src: t, x: s, y: r, autoPlay: l, ...n }, u) => {
+    const { parent: a, registerEventShape: e, unregisterEventShape: o } = C(), c = g(() => new H.ImageSequence(t), [t]), { eventHandlers: i, shapeProps: d } = g(() => {
+      const f = {}, v = {};
       for (const p in n)
-        L.includes(p) ? l[p] = n[
+        O.includes(p) ? f[p] = n[
           p
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
         ] : v[p] = n[p];
-      return { eventHandlers: l, shapeProps: v };
+      return { eventHandlers: f, shapeProps: v };
     }, [n]);
     return h(() => {
-      if (c)
-        return c.add(a), () => {
-          c.remove(a);
-        };
-    }, [c, a]), h(() => {
-      f ? a.play() : a.pause(), typeof i == "number" && (a.translation.x = i), typeof r == "number" && (a.translation.y = r);
-      for (const l in d)
-        l in a && (a[l] = d[l]);
-    }, [d, a, i, r, f]), h(() => {
-      if (Object.keys(o).length > 0)
-        return e(a, o, c ?? void 0), () => {
-          s(a);
+      if (a)
+        return a.add(c), () => {
+          a.remove(c);
+        };
+    }, [a, c]), h(() => {
+      l ? c.play() : c.pause(), typeof s == "number" && (c.translation.x = s), typeof r == "number" && (c.translation.y = r);
+      for (const f in d)
+        f in c && (c[f] = d[f]);
+    }, [d, c, s, r, l]), h(() => {
+      if (Object.keys(i).length > 0)
+        return e(c, i, a ?? void 0), () => {
+          o(c);
         };
     }, [
-      a,
-      e,
-      s,
       c,
-      o
-    ]), C(u, () => a, [a]), /* @__PURE__ */ S(G, {});
+      e,
+      o,
+      a,
+      i
+    ]), R(u, () => c, [c]), /* @__PURE__ */ E(T, {});
   }
 ), Re = k.forwardRef(
-  ({ x1: t, y1: i, x2: r, y2: f, ...n }, u) => {
-    const { parent: c, registerEventShape: e, unregisterEventShape: s } = j(), a = g(() => new H.Line(), []), { eventHandlers: o, shapeProps: d } = g(() => {
-      const l = {}, v = {};
+  ({ x1: t, y1: s, x2: r, y2: l, ...n }, u) => {
+    const { parent: a, registerEventShape: e, unregisterEventShape: o } = C(), c = g(() => new H.Line(), []), { eventHandlers: i, shapeProps: d } = g(() => {
+      const f = {}, v = {};
       for (const p in n)
-        L.includes(p) ? l[p] = n[
+        O.includes(p) ? f[p] = n[
           p
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
         ] : v[p] = n[p];
-      return { eventHandlers: l, shapeProps: v };
+      return { eventHandlers: f, shapeProps: v };
     }, [n]);
     return h(() => {
-      if (c)
-        return c.add(a), () => {
-          c.remove(a);
-        };
-    }, [c, a]), h(() => {
-      typeof t == "number" && (a.left.x = t), typeof i == "number" && (a.left.y = i), typeof r == "number" && (a.right.x = r), typeof f == "number" && (a.right.y = f);
-      for (const l in d)
-        l in a && (a[l] = d[l]);
-    }, [d, a, t, i, r, f]), h(() => {
-      if (Object.keys(o).length > 0)
-        return e(a, o, c ?? void 0), () => {
-          s(a);
-        };
-    }, [a, e, s, c, o]), C(u, () => a, [a]), /* @__PURE__ */ S(G, {});
+      if (a)
+        return a.add(c), () => {
+          a.remove(c);
+        };
+    }, [a, c]), h(() => {
+      typeof t == "number" && (c.left.x = t), typeof s == "number" && (c.left.y = s), typeof r == "number" && (c.right.x = r), typeof l == "number" && (c.right.y = l);
+      for (const f in d)
+        f in c && (c[f] = d[f]);
+    }, [d, c, t, s, r, l]), h(() => {
+      if (Object.keys(i).length > 0)
+        return e(c, i, a ?? void 0), () => {
+          o(c);
+        };
+    }, [c, e, o, a, i]), R(u, () => c, [c]), /* @__PURE__ */ E(T, {});
   }
 ), Ce = k.forwardRef(
-  ({ x: t, y: i, ...r }, f) => {
-    const { parent: n, registerEventShape: u, unregisterEventShape: c } = j(), e = g(() => new H.Polygon(), []), { eventHandlers: s, shapeProps: a } = g(() => {
-      const o = {}, d = {};
-      for (const l in r)
-        L.includes(l) ? o[l] = r[
-          l
+  ({ x: t, y: s, ...r }, l) => {
+    const { parent: n, registerEventShape: u, unregisterEventShape: a } = C(), e = g(() => new H.Polygon(), []), { eventHandlers: o, shapeProps: c } = g(() => {
+      const i = {}, d = {};
+      for (const f in r)
+        O.includes(f) ? i[f] = r[
+          f
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ] : d[l] = r[l];
-      return { eventHandlers: o, shapeProps: d };
+        ] : d[f] = r[f];
+      return { eventHandlers: i, shapeProps: d };
     }, [r]);
     return h(() => {
       if (n)
@@ -743,32 +756,32 @@ const pe = (t) => {
           n.remove(e);
         };
     }, [n, e]), h(() => {
-      typeof t == "number" && (e.translation.x = t), typeof i == "number" && (e.translation.y = i);
-      for (const o in a)
-        o in e && (e[o] = a[o]);
-    }, [a, e, t, i]), h(() => {
-      if (Object.keys(s).length > 0)
-        return u(e, s, n ?? void 0), () => {
-          c(e);
+      typeof t == "number" && (e.translation.x = t), typeof s == "number" && (e.translation.y = s);
+      for (const i in c)
+        i in e && (e[i] = c[i]);
+    }, [c, e, t, s]), h(() => {
+      if (Object.keys(o).length > 0)
+        return u(e, o, n ?? void 0), () => {
+          a(e);
         };
     }, [
       e,
       u,
-      c,
+      a,
       n,
-      s
-    ]), C(f, () => e, [e]), /* @__PURE__ */ S(G, {});
+      o
+    ]), R(l, () => e, [e]), /* @__PURE__ */ E(T, {});
   }
 ), je = k.forwardRef(
-  ({ x: t, y: i, ...r }, f) => {
-    const { parent: n, registerEventShape: u, unregisterEventShape: c } = j(), e = g(() => new H.Rectangle(), []), { eventHandlers: s, shapeProps: a } = g(() => {
-      const o = {}, d = {};
-      for (const l in r)
-        L.includes(l) ? o[l] = r[
-          l
+  ({ x: t, y: s, ...r }, l) => {
+    const { parent: n, registerEventShape: u, unregisterEventShape: a } = C(), e = g(() => new H.Rectangle(), []), { eventHandlers: o, shapeProps: c } = g(() => {
+      const i = {}, d = {};
+      for (const f in r)
+        O.includes(f) ? i[f] = r[
+          f
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ] : d[l] = r[l];
-      return { eventHandlers: o, shapeProps: d };
+        ] : d[f] = r[f];
+      return { eventHandlers: i, shapeProps: d };
     }, [r]);
     return h(() => {
       if (n)
@@ -776,32 +789,32 @@ const pe = (t) => {
           n.remove(e);
         };
     }, [n, e]), h(() => {
-      typeof t == "number" && (e.translation.x = t), typeof i == "number" && (e.translation.y = i);
-      for (const o in a)
-        o in e && (e[o] = a[o]);
-    }, [a, e, t, i]), h(() => {
-      if (Object.keys(s).length > 0)
-        return u(e, s, n ?? void 0), () => {
-          c(e);
+      typeof t == "number" && (e.translation.x = t), typeof s == "number" && (e.translation.y = s);
+      for (const i in c)
+        i in e && (e[i] = c[i]);
+    }, [c, e, t, s]), h(() => {
+      if (Object.keys(o).length > 0)
+        return u(e, o, n ?? void 0), () => {
+          a(e);
         };
     }, [
       e,
       u,
-      c,
+      a,
       n,
-      s
-    ]), C(f, () => e, [e]), /* @__PURE__ */ S(G, {});
+      o
+    ]), R(l, () => e, [e]), /* @__PURE__ */ E(T, {});
   }
-), Oe = k.forwardRef(
-  ({ x: t, y: i, ...r }, f) => {
-    const { parent: n, registerEventShape: u, unregisterEventShape: c } = j(), e = g(() => new H.RoundedRectangle(), []), { eventHandlers: s, shapeProps: a } = g(() => {
-      const o = {}, d = {};
-      for (const l in r)
-        L.includes(l) ? o[l] = r[
-          l
+), Le = k.forwardRef(
+  ({ x: t, y: s, ...r }, l) => {
+    const { parent: n, registerEventShape: u, unregisterEventShape: a } = C(), e = g(() => new H.RoundedRectangle(), []), { eventHandlers: o, shapeProps: c } = g(() => {
+      const i = {}, d = {};
+      for (const f in r)
+        O.includes(f) ? i[f] = r[
+          f
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ] : d[l] = r[l];
-      return { eventHandlers: o, shapeProps: d };
+        ] : d[f] = r[f];
+      return { eventHandlers: i, shapeProps: d };
     }, [r]);
     return h(() => {
       if (n)
@@ -809,71 +822,71 @@ const pe = (t) => {
           n.remove(e);
         };
     }, [n, e]), h(() => {
-      typeof t == "number" && (e.translation.x = t), typeof i == "number" && (e.translation.y = i);
-      for (const o in a)
-        o in e && (e[o] = a[o]);
-    }, [a, e, t, i]), h(() => {
-      if (Object.keys(s).length > 0)
+      typeof t == "number" && (e.translation.x = t), typeof s == "number" && (e.translation.y = s);
+      for (const i in c)
+        i in e && (e[i] = c[i]);
+    }, [c, e, t, s]), h(() => {
+      if (Object.keys(o).length > 0)
         return u(
           e,
-          s,
+          o,
           n ?? void 0
         ), () => {
-          c(e);
+          a(e);
         };
     }, [
       e,
       u,
-      c,
+      a,
       n,
-      s
-    ]), C(f, () => e, [
+      o
+    ]), R(l, () => e, [
       e
-    ]), /* @__PURE__ */ S(G, {});
+    ]), /* @__PURE__ */ E(T, {});
   }
-), Le = k.forwardRef(
-  ({ src: t, x: i, y: r, autoPlay: f, ...n }, u) => {
-    const { parent: c, registerEventShape: e, unregisterEventShape: s } = j(), a = g(() => new H.Sprite(t), [t]), { eventHandlers: o, shapeProps: d } = g(() => {
-      const l = {}, v = {};
+), Oe = k.forwardRef(
+  ({ src: t, x: s, y: r, autoPlay: l, ...n }, u) => {
+    const { parent: a, registerEventShape: e, unregisterEventShape: o } = C(), c = g(() => new H.Sprite(t), [t]), { eventHandlers: i, shapeProps: d } = g(() => {
+      const f = {}, v = {};
       for (const p in n)
-        L.includes(p) ? l[p] = n[
+        O.includes(p) ? f[p] = n[
           p
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
         ] : v[p] = n[p];
-      return { eventHandlers: l, shapeProps: v };
+      return { eventHandlers: f, shapeProps: v };
     }, [n]);
     return h(() => {
-      if (c)
-        return c.add(a), () => {
-          c.remove(a);
-        };
-    }, [c, a]), h(() => {
-      typeof i == "number" && (a.translation.x = i), typeof r == "number" && (a.translation.y = r), f ? a.play() : a.pause();
-      for (const l in d)
-        l in a && (a[l] = d[l]);
-    }, [d, a, i, r, f]), h(() => {
-      if (Object.keys(o).length > 0)
-        return e(a, o, c ?? void 0), () => {
-          s(a);
+      if (a)
+        return a.add(c), () => {
+          a.remove(c);
+        };
+    }, [a, c]), h(() => {
+      typeof s == "number" && (c.translation.x = s), typeof r == "number" && (c.translation.y = r), l ? c.play() : c.pause();
+      for (const f in d)
+        f in c && (c[f] = d[f]);
+    }, [d, c, s, r, l]), h(() => {
+      if (Object.keys(i).length > 0)
+        return e(c, i, a ?? void 0), () => {
+          o(c);
         };
     }, [
-      a,
-      e,
-      s,
       c,
-      o
-    ]), C(u, () => a, [a]), /* @__PURE__ */ S(G, {});
+      e,
+      o,
+      a,
+      i
+    ]), R(u, () => c, [c]), /* @__PURE__ */ E(T, {});
   }
 ), Ve = k.forwardRef(
-  ({ x: t, y: i, ...r }, f) => {
-    const { parent: n, registerEventShape: u, unregisterEventShape: c } = j(), e = g(() => new H.Star(), []), { eventHandlers: s, shapeProps: a } = g(() => {
-      const o = {}, d = {};
-      for (const l in r)
-        L.includes(l) ? o[l] = r[
-          l
+  ({ x: t, y: s, ...r }, l) => {
+    const { parent: n, registerEventShape: u, unregisterEventShape: a } = C(), e = g(() => new H.Star(), []), { eventHandlers: o, shapeProps: c } = g(() => {
+      const i = {}, d = {};
+      for (const f in r)
+        O.includes(f) ? i[f] = r[
+          f
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ] : d[l] = r[l];
-      return { eventHandlers: o, shapeProps: d };
+        ] : d[f] = r[f];
+      return { eventHandlers: i, shapeProps: d };
     }, [r]);
     return h(() => {
       if (n)
@@ -881,65 +894,65 @@ const pe = (t) => {
           n.remove(e);
         };
     }, [n, e]), h(() => {
-      typeof t == "number" && (e.translation.x = t), typeof i == "number" && (e.translation.y = i);
-      for (const o in a)
-        o in e && (e[o] = a[o]);
-    }, [a, e, t, i]), h(() => {
-      if (Object.keys(s).length > 0)
-        return u(e, s, n ?? void 0), () => {
-          c(e);
-        };
-    }, [e, u, c, n, s]), C(f, () => e, [e]), /* @__PURE__ */ S(G, {});
+      typeof t == "number" && (e.translation.x = t), typeof s == "number" && (e.translation.y = s);
+      for (const i in c)
+        i in e && (e[i] = c[i]);
+    }, [c, e, t, s]), h(() => {
+      if (Object.keys(o).length > 0)
+        return u(e, o, n ?? void 0), () => {
+          a(e);
+        };
+    }, [e, u, a, n, o]), R(l, () => e, [e]), /* @__PURE__ */ E(T, {});
   }
 ), Ge = k.forwardRef(
-  ({ x1: t, y1: i, x2: r, y2: f, ...n }, u) => {
-    const c = g(() => new H.LinearGradient(), []);
+  ({ x1: t, y1: s, x2: r, y2: l, ...n }, u) => {
+    const a = g(() => new H.LinearGradient(), []);
     return h(() => {
-      typeof t == "number" && (c.left.x = t), typeof i == "number" && (c.left.y = i), typeof r == "number" && (c.right.x = r), typeof f == "number" && (c.right.y = f);
+      typeof t == "number" && (a.left.x = t), typeof s == "number" && (a.left.y = s), typeof r == "number" && (a.right.x = r), typeof l == "number" && (a.right.y = l);
       for (const e in n)
-        e in c && (c[e] = n[e]);
-    }, [c, t, i, r, f, n]), C(u, () => c, [c]), null;
+        e in a && (a[e] = n[e]);
+    }, [a, t, s, r, l, n]), R(u, () => a, [a]), null;
   }
 ), Te = k.forwardRef(
-  ({ x: t, y: i, focalX: r, focalY: f, ...n }, u) => {
-    const c = g(() => new H.RadialGradient(), []);
+  ({ x: t, y: s, focalX: r, focalY: l, ...n }, u) => {
+    const a = g(() => new H.RadialGradient(), []);
     return h(() => {
-      typeof t == "number" && (c.center.x = t), typeof i == "number" && (c.center.y = i), typeof r == "number" && (c.focal.x = r), typeof f == "number" && (c.focal.y = f);
+      typeof t == "number" && (a.center.x = t), typeof s == "number" && (a.center.y = s), typeof r == "number" && (a.focal.x = r), typeof l == "number" && (a.focal.y = l);
       for (const e in n)
-        e in c && (c[e] = n[e]);
-    }, [n, c, t, i, r, f]), C(u, () => c, [c]), null;
+        e in a && (a[e] = n[e]);
+    }, [n, a, t, s, r, l]), R(u, () => a, [a]), null;
   }
 ), Me = k.forwardRef(
-  ({ src: t, ...i }, r) => {
-    const f = g(() => new H.Texture(t), [t]);
+  ({ src: t, ...s }, r) => {
+    const l = g(() => new H.Texture(t), [t]);
     return h(() => {
-      for (const n in i)
-        n in f && (f[n] = i[n]);
-    }, [i, f]), C(r, () => f, [f]), null;
+      for (const n in s)
+        n in l && (l[n] = s[n]);
+    }, [s, l]), R(r, () => l, [l]), null;
   }
 );
 export {
   be as ArcSegment,
   pe as Canvas,
   Ee as Circle,
-  ae as Context,
+  ce as Context,
   Se as Ellipse,
   ge as Group,
   ke as Image,
   He as ImageSequence,
   Re as Line,
   Ge as LinearGradient,
-  ye as Path,
-  Pe as Points,
+  me as Path,
+  we as Points,
   Ce as Polygon,
   Te as RadialGradient,
   je as Rectangle,
-  Oe as RoundedRectangle,
-  me as SVG,
-  Le as Sprite,
+  Le as RoundedRectangle,
+  ye as SVG,
+  Oe as Sprite,
   Ve as Star,
-  we as Text,
+  Pe as Text,
   Me as Texture,
   ve as useFrame,
-  j as useTwo
+  C as useTwo
 };