react-two.js 0.8.22-r.1 → 0.8.22-r.3

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

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