react-two.js 0.1.0 → 0.2.0

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

@@ -1,508 +1,450 @@
-import { jsx as v, Fragment as y } from "react/jsx-runtime";
-import h, { createContext as I, useContext as L, useRef as m, useEffect as l, useState as T, useImperativeHandle as R, useLayoutEffect as G } from "react";
-import w from "two.js";
-const E = I({ two: null, parent: null, width: 0, height: 0 }), g = () => L(E), j = (o, a = []) => {
-  const { two: u } = g(), r = m(o);
+import { jsx as g, Fragment as R } from "react/jsx-runtime";
+import w, { createContext as G, useContext as L, useRef as I, useEffect as l, useState as b, useImperativeHandle as y, useLayoutEffect as S, useMemo as P } from "react";
+import m from "two.js";
+const C = G({ two: null, parent: null, width: 0, height: 0 }), h = () => L(C), j = (r, o = []) => {
+  const { two: i } = h(), a = I(r);
   l(() => {
-    r.current = o;
-  }, [o, ...a]), l(() => {
-    if (!u)
+    a.current = r;
+  }, [r, ...o]), l(() => {
+    if (!i)
       return;
-    let i = 0;
-    return u.bind("update", f), () => u.unbind("update", f);
-    function f(t, n) {
+    let c = 0;
+    return i.bind("update", s), () => i.unbind("update", s);
+    function s(n, t) {
       var e;
-      i += n / 1e3, (e = r.current) == null || e.call(r, i, n);
+      c += t / 1e3, (e = a.current) == null || e.call(a, c, t);
     }
-  }, [u, ...a]);
-}, H = (o) => {
-  const { two: a, parent: u } = g(), r = m(null), [i, f] = T({
-    two: a,
-    parent: u,
+  }, [i, ...o]);
+}, H = (r) => {
+  const { two: o, parent: i } = h(), a = I(null), [c, s] = b({
+    two: o,
+    parent: i,
     width: 0,
     height: 0
   });
-  l(t, [o]);
-  function t() {
-    let n = () => {
+  l(n, [r]);
+  function n() {
+    let t = () => {
     };
-    if (!a) {
-      let c = function() {
-        const b = s.width !== k, C = !1;
-        b && (k = s.width), (b || C) && f((q) => ({ ...q, width: k, height: S }));
+    if (!o) {
+      let f = function() {
+        const p = d.width !== v, k = !1;
+        p && (v = d.width), (p || k) && s((T) => ({ ...T, width: v, height: E }));
       };
-      const d = { ...o };
-      delete d.children;
-      const s = new w(d).appendTo(r.current);
-      let k = s.width, S = s.height;
-      f({ two: s, parent: s.scene, width: k, height: S }), s.bind("update", c), n = () => {
-        var C;
-        (C = s.renderer.domElement.parentElement) == null || C.removeChild(
-          s.renderer.domElement
-        ), s.unbind("update", c);
-        const b = w.Instances.indexOf(s);
-        w.Instances.splice(b, 1), s.pause();
+      const u = { ...r };
+      delete u.children;
+      const d = new m(u).appendTo(a.current);
+      let v = d.width, E = d.height;
+      s({ two: d, parent: d.scene, width: v, height: E }), d.bind("update", f), t = () => {
+        var k;
+        (k = d.renderer.domElement.parentElement) == null || k.removeChild(
+          d.renderer.domElement
+        ), d.unbind("update", f);
+        const p = m.Instances.indexOf(d);
+        m.Instances.splice(p, 1), d.pause();
       };
     }
-    return n;
+    return t;
   }
-  return /* @__PURE__ */ v(E.Provider, { value: i, children: /* @__PURE__ */ v("div", { ref: r, children: o.children }) });
-}, O = h.forwardRef(
-  ({ x: o, y: a, ...u }, r) => {
-    const { two: i, parent: f, width: t, height: n } = g(), [e, c] = T(null);
-    l(() => {
-      if (i) {
-        const s = new w.Group();
-        return typeof o == "number" && (s.position.x = o), typeof a == "number" && (s.position.y = a), c(s), () => {
-          c(null);
+  return /* @__PURE__ */ g(C.Provider, { value: c, children: /* @__PURE__ */ g("div", { ref: a, children: r.children }) });
+}, M = w.forwardRef(
+  ({ x: r, y: o, ...i }, a) => {
+    const { two: c, parent: s, width: n, height: t } = h(), [e, f] = b(null);
+    return l(() => {
+      if (c) {
+        const u = new m.Group();
+        return f(u), () => {
+          f(null);
         };
       }
-    }, [o, a, i]), l(() => {
-      const s = e;
-      if (f && s)
-        return f.add(s), d(), () => {
-          f.remove(s);
+    }, [c]), l(() => {
+      const u = e;
+      if (s && u)
+        return s.add(u), () => {
+          s.remove(u);
         };
-    }, [e, f]), l(d, [u]);
-    function d() {
-      c((s) => {
-        if (s) {
-          const k = { ...u };
-          delete k.children;
-          for (const S in k)
-            S in s && (s[S] = k[S]);
-        }
-        return s;
-      });
-    }
-    return R(r, () => e, [e]), /* @__PURE__ */ v(E.Provider, { value: { two: i, parent: e, width: t, height: n }, children: u.children });
+    }, [e, s]), l(() => {
+      if (e) {
+        const u = e;
+        typeof r == "number" && (u.translation.x = r), typeof o == "number" && (u.translation.y = o);
+        const d = { ...i };
+        delete d.children;
+        for (const v in d)
+          v in u && (u[v] = d[v]);
+      }
+    }, [e, r, o, i]), y(a, () => e, [e]), /* @__PURE__ */ g(C.Provider, { value: { two: c, parent: e, width: n, height: t }, children: i.children });
   }
-), _ = h.forwardRef(
-  ({ manual: o, ...a }, u) => {
-    const { two: r, parent: i } = g(), f = m(null);
-    l(() => {
-      const n = new w.Path();
-      return f.current = n, o && (f.current.automatic = !1), () => {
-        f.current = null;
+), O = w.forwardRef(
+  ({ manual: r, x: o, y: i, ...a }, c) => {
+    const { two: s, parent: n } = h(), [t, e] = b(null);
+    return l(() => {
+      const f = new m.Path();
+      return e(f), () => {
+        e(null);
       };
-    }, [o, r]), l(() => {
-      const n = f.current;
-      if (i && n)
-        return i.add(n), t(), () => {
-          i.remove(n);
+    }, [s]), l(() => {
+      if (n && t)
+        return n.add(t), () => {
+          n.remove(t);
         };
-    }, [i]), l(t, [a]);
-    function t() {
-      if (f.current) {
-        const n = f.current;
-        for (const e in a)
-          e in n && (n[e] = a[e]);
+    }, [n, t]), l(() => {
+      if (t) {
+        const f = t;
+        typeof o == "number" && (f.translation.x = o), typeof i == "number" && (f.translation.y = i), typeof r < "u" && (f.automatic = !r);
+        for (const u in a)
+          u in f && (f[u] = a[u]);
       }
-    }
-    return R(u, () => f.current), /* @__PURE__ */ v(y, {});
+    }, [a, t, o, i, r]), y(c, () => t, [t]), /* @__PURE__ */ g(R, {});
   }
-), z = h.forwardRef(
-  (o, a) => {
-    const { two: u, parent: r } = g(), i = m(null);
-    l(() => {
-      const t = new w.Points();
-      return i.current = t, () => {
-        i.current = null;
+), _ = w.forwardRef(
+  ({ x: r, y: o, ...i }, a) => {
+    const { two: c, parent: s } = h(), [n, t] = b(null);
+    return l(() => {
+      const e = new m.Points();
+      return t(e), () => {
+        t(null);
       };
-    }, [u]), l(() => {
-      const t = i.current;
-      if (r && t)
-        return r.add(t), f(), () => {
-          r.remove(t);
+    }, [c, r, o]), l(() => {
+      if (s && n)
+        return s.add(n), () => {
+          s.remove(n);
         };
-    }, [r]), l(f, [o]);
-    function f() {
-      if (i.current) {
-        const t = i.current;
-        for (const n in o)
-          n in t && (t[n] = o[n]);
+    }, [s, n]), l(() => {
+      if (n) {
+        const e = n;
+        typeof r == "number" && (e.translation.x = r), typeof o == "number" && (e.translation.y = o);
+        for (const f in i)
+          f in e && (e[f] = i[f]);
       }
-    }
-    return R(a, () => i.current), /* @__PURE__ */ v(y, {});
+    }, [i, n, r, o]), y(a, () => n, [n]), /* @__PURE__ */ g(R, {});
   }
-), B = h.forwardRef(
-  ({ x: o, y: a, ...u }, r) => {
-    const { two: i, parent: f } = g(), t = m(null);
-    l(() => {
-      const e = new w.Text(u.value, o, a);
-      return t.current = e, () => {
-        t.current = null;
+), z = w.forwardRef(
+  ({ x: r, y: o, ...i }, a) => {
+    const { two: c, parent: s } = h(), [n, t] = b(null);
+    return l(() => {
+      const e = new m.Text();
+      return t(e), () => {
+        t(null);
       };
-    }, [o, a, i]), l(() => {
-      const e = t.current;
-      if (f && e)
-        return f.add(e), n(), () => {
-          f.remove(e);
+    }, [c]), l(() => {
+      if (s && n)
+        return s.add(n), () => {
+          s.remove(n);
         };
-    }, [f]), l(n, [u]);
-    function n() {
-      if (t.current) {
-        const e = t.current;
-        for (const c in u)
-          c in e && (e[c] = u[c]);
+    }, [s, n]), l(() => {
+      if (n) {
+        const e = n;
+        typeof r == "number" && (e.translation.x = r), typeof o == "number" && (e.translation.y = o);
+        for (const f in i)
+          f in e && (e[f] = i[f]);
       }
-    }
-    return R(r, () => t.current), /* @__PURE__ */ v(y, {});
+    }, [i, n, r, o]), y(a, () => n, [n]), /* @__PURE__ */ g(R, {});
   }
-), J = h.forwardRef(
-  ({ x: o, y: a, resolution: u, ...r }, i) => {
-    const { two: f, parent: t } = g(), n = m(null);
-    l(() => {
-      const c = new w.ArcSegment(
-        o,
-        a,
-        r.innerRadius,
-        r.outerRadius,
-        r.startAngle,
-        r.endAngle,
-        u
-      );
-      return n.current = c, () => {
-        n.current = null;
+), B = w.forwardRef(
+  ({ x: r, y: o, resolution: i, ...a }, c) => {
+    const { two: s, parent: n } = h(), [t, e] = b(null);
+    return l(() => {
+      const f = new m.ArcSegment(0, 0, 0, 0, 0, 0, i);
+      return e(f), () => {
+        e(null);
       };
-    }, [o, a, u, f]), l(() => {
-      const c = n.current;
-      if (t && c)
-        return t.add(c), e(), () => {
-          t.remove(c);
+    }, [i, s]), l(() => {
+      if (n && t)
+        return n.add(t), () => {
+          n.remove(t);
         };
-    }, [t]), l(e, [r]);
-    function e() {
-      if (n.current) {
-        const c = n.current;
-        for (const d in r)
-          d in c && (c[d] = r[d]);
+    }, [n, t]), l(() => {
+      if (t) {
+        const f = t;
+        typeof r == "number" && (f.translation.x = r), typeof o == "number" && (f.translation.y = o);
+        for (const u in a)
+          u in f && (f[u] = a[u]);
       }
-    }
-    return R(i, () => n.current), /* @__PURE__ */ v(y, {});
+    }, [a, t, r, o]), y(c, () => t, [t]), /* @__PURE__ */ g(R, {});
+  }
+), J = w.forwardRef(
+  ({ x: r, y: o, resolution: i, ...a }, c) => {
+    const { two: s, parent: n } = h(), [t, e] = b(null);
+    return l(() => {
+      const f = new m.Circle(0, 0, 0, i);
+      return e(f), () => {
+        e(null);
+      };
+    }, [i, s]), l(() => {
+      if (t) {
+        const f = t;
+        typeof r == "number" && (f.translation.x = r), typeof o == "number" && (f.translation.y = o);
+        for (const u in a)
+          u in f && (f[u] = a[u]);
+      }
+    }, [t, a, r, o]), l(() => {
+      if (n && t)
+        return n.add(t), () => {
+          n.remove(t);
+        };
+    }, [n, t]), y(c, () => t, [t]), /* @__PURE__ */ g(R, {});
   }
-), K = h.forwardRef(
-  ({ x: o, y: a, resolution: u, ...r }, i) => {
-    const { two: f, parent: t } = g(), n = m(null);
-    l(() => {
-      const c = new w.Circle(o, a, r.radius, u);
-      return n.current = c, () => {
-        n.current = null;
+), K = w.forwardRef(
+  ({ x: r, y: o, resolution: i, ...a }, c) => {
+    const { two: s, parent: n } = h(), [t, e] = b(null);
+    return l(() => {
+      const f = new m.Ellipse(0, 0, 0, 0, i);
+      return e(f), () => {
+        e(null);
       };
-    }, [o, a, u, f]), l(() => {
-      const c = n.current;
-      if (t && c)
-        return t.add(c), e(), () => {
-          t.remove(c);
+    }, [i, s]), l(() => {
+      if (n && t)
+        return n.add(t), () => {
+          n.remove(t);
         };
-    }, [t]), l(e, [r]);
-    function e() {
-      if (n.current) {
-        const c = n.current;
-        for (const d in r)
-          d in c && (c[d] = r[d]);
+    }, [n]), l(() => {
+      if (t) {
+        const f = t;
+        typeof r == "number" && (f.translation.x = r), typeof o == "number" && (f.translation.y = o);
+        for (const u in a)
+          u in f && (f[u] = a[u]);
       }
-    }
-    return R(i, () => n.current), /* @__PURE__ */ v(y, {});
+    }, [t, r, o, a]), y(c, () => t, [t]), /* @__PURE__ */ g(R, {});
   }
-), M = h.forwardRef(
-  ({ x: o, y: a, resolution: u, ...r }, i) => {
-    const { two: f, parent: t } = g(), n = m(null);
-    l(() => {
-      const c = new w.Ellipse(
-        o,
-        a,
-        typeof r.width == "number" ? r.width / 2 : void 0,
-        typeof r.height == "number" ? r.height / 2 : void 0,
-        u
-      );
-      return n.current = c, () => {
-        n.current = null;
+), N = w.forwardRef(
+  ({ mode: r, texture: o, x: i, y: a, ...c }, s) => {
+    const { two: n, parent: t } = h(), [e, f] = b(null);
+    return S(() => {
+      const u = new m.Image();
+      return f(u), () => {
+        f(null);
       };
-    }, [o, a, u, f]), l(() => {
-      const c = n.current;
-      if (t && c)
-        return t.add(c), e(), () => {
-          t.remove(c);
+    }, [n]), l(() => {
+      if (t && e)
+        return t.add(e), () => {
+          t.remove(e);
         };
-    }, [t]), l(e, [r]);
-    function e() {
-      if (n.current) {
-        const c = n.current;
-        for (const d in r)
-          d in c && (c[d] = r[d]);
+    }, [t, e]), l(() => {
+      if (e) {
+        const u = e;
+        typeof r < "u" && (u.mode = r), typeof o < "u" && (u.texture = o), typeof i == "number" && (u.translation.x = i), typeof a == "number" && (u.translation.y = a);
+        for (const d in c)
+          d in u && (u[d] = c[d]);
       }
-    }
-    return R(i, () => n.current), /* @__PURE__ */ v(y, {});
+    }, [e, c, r, o, i, a]), y(s, () => e, [e]), /* @__PURE__ */ g(R, {});
   }
-), N = h.forwardRef(
-  ({ paths: o, x: a, y: u, autoPlay: r, ...i }, f) => {
-    const { two: t, parent: n } = g(), e = m(null);
-    G(() => {
-      const d = new w.ImageSequence(o, a, u, i.frameRate);
-      return e.current = d, r && e.current.play(), () => {
-        e.current = null;
+), Q = w.forwardRef(
+  ({ paths: r, x: o, y: i, autoPlay: a, ...c }, s) => {
+    const { two: n, parent: t } = h(), [e, f] = b(null);
+    return S(() => {
+      const u = new m.ImageSequence(r);
+      return f(u), () => {
+        f(null);
       };
-    }, [o, a, u, t]), l(() => {
-      const d = e.current;
-      if (n && d)
-        return n.add(d), c(), () => {
-          n.remove(d);
+    }, [n, r]), l(() => {
+      if (t && e)
+        return t.add(e), () => {
+          t.remove(e);
         };
-    }, [n]), l(() => {
-      var d, s;
-      r ? (d = e.current) == null || d.play() : (s = e.current) == null || s.pause();
-    }, [r]), l(c, [i]);
-    function c() {
-      if (e.current) {
-        const d = e.current;
-        for (const s in i)
-          s in d && (d[s] = i[s]);
+    }, [t, e]), l(() => {
+      if (e) {
+        const u = e;
+        a ? u.play() : u.pause(), typeof o == "number" && (u.translation.x = o), typeof i == "number" && (u.translation.y = i);
+        for (const d in c)
+          d in u && (u[d] = c[d]);
       }
-    }
-    return R(f, () => e.current), /* @__PURE__ */ v(y, {});
+    }, [c, e, r, o, i, a]), y(s, () => e, [e]), /* @__PURE__ */ g(R, {});
   }
-), Q = h.forwardRef(
-  ({ x1: o, y1: a, x2: u, y2: r, ...i }, f) => {
-    const { two: t, parent: n } = g(), e = m(null);
-    l(() => {
-      const d = new w.Line(o, a, u, r);
-      return e.current = d, () => {
-        e.current = null;
+), U = w.forwardRef(
+  ({ x1: r, y1: o, x2: i, y2: a, ...c }, s) => {
+    const { two: n, parent: t } = h(), [e, f] = b(null);
+    return l(() => {
+      const u = new m.Line();
+      return f(u), () => {
+        f(null);
       };
-    }, [o, a, u, r, t]), l(() => {
-      const d = e.current;
-      if (n && d)
-        return n.add(d), c(), () => {
-          n.remove(d);
+    }, [n]), l(() => {
+      const u = e;
+      if (t && u)
+        return t.add(u), () => {
+          t.remove(u);
         };
-    }, [n]), l(c, [i]);
-    function c() {
-      if (e.current) {
-        const d = e.current;
-        for (const s in i)
-          s in d && (d[s] = i[s]);
+    }, [t, e]), l(() => {
+      if (e) {
+        const u = e;
+        typeof r == "number" && (u.left.x = r), typeof o == "number" && (u.left.y = o), typeof i == "number" && (u.right.x = i), typeof a == "number" && (u.right.y = a);
+        for (const d in c)
+          d in u && (u[d] = c[d]);
       }
-    }
-    return R(f, () => e.current), /* @__PURE__ */ v(y, {});
+    }, [c, e, r, o, i, a]), y(s, () => e, [e]), /* @__PURE__ */ g(R, {});
   }
-), U = h.forwardRef(
-  ({ x: o, y: a, radius: u, ...r }, i) => {
-    const { two: f, parent: t } = g(), n = m(null);
-    l(() => {
-      const c = new w.Polygon(o, a, u, r.sides);
-      return n.current = c, () => {
-        n.current = null;
+), V = w.forwardRef(
+  ({ x: r, y: o, ...i }, a) => {
+    const { two: c, parent: s } = h(), [n, t] = b(null);
+    return l(() => {
+      const e = new m.Polygon();
+      return t(e), () => {
+        t(null);
       };
-    }, [o, a, u, f]), l(() => {
-      const c = n.current;
-      if (t && c)
-        return t.add(c), e(), () => {
-          t.remove(c);
+    }, [c]), l(() => {
+      if (s && n)
+        return s.add(n), () => {
+          s.remove(n);
         };
-    }, [t]), l(e, [r]);
-    function e() {
-      if (n.current) {
-        const c = n.current;
-        for (const d in r)
-          d in c && (c[d] = r[d]);
+    }, [s, n]), l(() => {
+      if (n) {
+        const e = n;
+        typeof r == "number" && (e.translation.x = r), typeof o == "number" && (e.translation.y = o);
+        for (const f in i)
+          f in e && (e[f] = i[f]);
       }
-    }
-    return R(i, () => n.current), /* @__PURE__ */ v(y, {});
+    }, [i, n, r, o]), y(a, () => n, [n]), /* @__PURE__ */ g(R, {});
   }
-), V = h.forwardRef(
-  ({ x: o, y: a, ...u }, r) => {
-    const { two: i, parent: f } = g(), t = m(null);
-    l(() => {
-      const e = new w.Rectangle(o, a, u.width, u.height);
-      return t.current = e, () => {
-        t.current = null;
+), W = w.forwardRef(
+  ({ x: r, y: o, ...i }, a) => {
+    const { two: c, parent: s } = h(), [n, t] = b(null);
+    return l(() => {
+      const e = new m.Rectangle();
+      return t(e), () => {
+        t(null);
       };
-    }, [o, a, i]), l(() => {
-      const e = t.current;
-      if (f && e)
-        return f.add(e), n(), () => {
-          f.remove(e);
+    }, [c]), l(() => {
+      if (s && n)
+        return s.add(n), () => {
+          s.remove(n);
         };
-    }, [f]), l(n, [u]);
-    function n() {
-      if (t.current) {
-        const e = t.current;
-        for (const c in u)
-          c in e && (e[c] = u[c]);
+    }, [s, n]), l(() => {
+      if (n) {
+        const e = n;
+        typeof r == "number" && (e.translation.x = r), typeof o == "number" && (e.translation.y = o);
+        for (const f in i)
+          f in e && (e[f] = i[f]);
       }
-    }
-    return R(r, () => t.current), /* @__PURE__ */ v(y, {});
+    }, [i, n, r, o]), y(a, () => n, [n]), /* @__PURE__ */ g(R, {});
   }
-), W = h.forwardRef(({ x: o, y: a, ...u }, r) => {
-  const { two: i, parent: f } = g(), t = m(null);
-  l(() => {
-    const e = new w.RoundedRectangle(
-      o,
-      a,
-      u.width,
-      u.height,
-      u.radius
-    );
-    return t.current = e, () => {
-      t.current = null;
-    };
-  }, [o, a, i]), l(() => {
-    const e = t.current;
-    if (f && e)
-      return f.add(e), n(), () => {
-        f.remove(e);
+), Z = w.forwardRef(
+  ({ x: r, y: o, ...i }, a) => {
+    const { two: c, parent: s } = h(), [n, t] = b(null);
+    return l(() => {
+      const e = new m.RoundedRectangle();
+      return t(e), () => {
+        t(null);
       };
-  }, [f]), l(n, [u]);
-  function n() {
-    if (t.current) {
-      const e = t.current;
-      for (const c in u)
-        c in e && (e[c] = u[c]);
-    }
+    }, [c]), l(() => {
+      if (s && n)
+        return s.add(n), () => {
+          s.remove(n);
+        };
+    }, [s, n]), l(() => {
+      if (n) {
+        const e = n;
+        typeof r == "number" && (e.translation.x = r), typeof o == "number" && (e.translation.y = o);
+        for (const f in i)
+          f in e && (e[f] = i[f]);
+      }
+    }, [i, n, r, o]), y(a, () => n, [n]), /* @__PURE__ */ g(R, {});
   }
-  return R(r, () => t.current), /* @__PURE__ */ v(y, {});
-}), Z = h.forwardRef(
-  ({ path: o, x: a, y: u, autoPlay: r, ...i }, f) => {
-    const { two: t, parent: n } = g(), e = m(null);
-    G(() => {
-      const d = new w.Sprite(
-        o,
-        a,
-        u,
-        i.columns,
-        i.rows,
-        i.frameRate
-      );
-      return e.current = d, r && e.current.play(), () => {
-        e.current = null;
+), $ = w.forwardRef(
+  ({ path: r, x: o, y: i, autoPlay: a, ...c }, s) => {
+    const { two: n, parent: t } = h(), [e, f] = b(null);
+    return S(() => {
+      const u = new m.Sprite(r);
+      return f(u), () => {
+        f(null);
       };
-    }, [o, a, u, t]), l(() => {
-      const d = e.current;
-      if (n && d)
-        return n.add(d), c(), () => {
-          n.remove(d);
+    }, [r, n]), l(() => {
+      if (t && e)
+        return t.add(e), () => {
+          t.remove(e);
         };
-    }, [n]), l(() => {
-      var d, s;
-      r ? (d = e.current) == null || d.play() : (s = e.current) == null || s.pause();
-    }, [r]), l(c, [i]);
-    function c() {
-      if (e.current) {
-        const d = e.current;
-        for (const s in i)
-          s in d && (d[s] = i[s]);
+    }, [t]), l(() => {
+      if (e) {
+        const u = e;
+        typeof o == "number" && (u.translation.x = o), typeof i == "number" && (u.translation.y = i), a ? u.play() : u.pause();
+        for (const d in c)
+          d in u && (u[d] = c[d]);
       }
-    }
-    return R(f, () => e.current), /* @__PURE__ */ v(y, {});
+    }, [c, e, o, i, a]), y(s, () => e, [e]), /* @__PURE__ */ g(R, {});
   }
-), $ = h.forwardRef(
-  ({ x: o, y: a, ...u }, r) => {
-    const { two: i, parent: f } = g(), t = m(null);
-    l(() => {
-      const e = new w.Star(
-        o,
-        a,
-        u.innerRadius,
-        u.outerRadius,
-        u.sides
-      );
-      return t.current = e, () => {
-        t.current = null;
+), D = w.forwardRef(
+  ({ x: r, y: o, ...i }, a) => {
+    const { two: c, parent: s } = h(), [n, t] = b(null);
+    return l(() => {
+      const e = new m.Star();
+      return t(e), () => {
+        t(null);
       };
-    }, [o, a, i]), l(() => {
-      const e = t.current;
-      if (f && e)
-        return f.add(e), n(), () => {
-          f.remove(e);
+    }, [c]), l(() => {
+      if (s && n)
+        return s.add(n), () => {
+          s.remove(n);
         };
-    }, [f]), l(n, [u]);
-    function n() {
-      if (t.current) {
-        const e = t.current;
-        for (const c in u)
-          c in e && (e[c] = u[c]);
+    }, [s, n]), l(() => {
+      if (n) {
+        const e = n;
+        typeof r == "number" && (e.translation.x = r), typeof o == "number" && (e.translation.y = o);
+        for (const f in i)
+          f in e && (e[f] = i[f]);
       }
-    }
-    return R(r, () => t.current), /* @__PURE__ */ v(y, {});
+    }, [i, n, r, o]), y(a, () => n, [n]), /* @__PURE__ */ g(R, {});
   }
-), D = h.forwardRef(
-  ({ x1: o, y1: a, x2: u, y2: r, ...i }, f) => {
-    const { two: t } = g(), n = m(null);
-    !n.current && t && (n.current = new w.LinearGradient(o, a, u, r, i.stops)), l(() => {
-      n.current && (typeof o == "number" && (n.current.left.x = o), typeof a == "number" && (n.current.left.y = a), typeof u == "number" && (n.current.right.x = u), typeof r == "number" && (n.current.right.y = r));
-    }, [o, a, u, r]), l(e, [i]);
-    function e() {
-      if (n.current) {
-        const c = n.current;
-        for (const d in i)
-          d in c && (c[d] = i[d]);
+), X = w.forwardRef(
+  ({ x1: r, y1: o, x2: i, y2: a, ...c }, s) => {
+    const n = P(() => new m.LinearGradient(), []);
+    return l(() => {
+      if (n) {
+        const t = n;
+        typeof r == "number" && (t.left.x = r), typeof o == "number" && (t.left.y = o), typeof i == "number" && (t.right.x = i), typeof a == "number" && (t.right.y = a);
+        for (const e in c)
+          e in t && (t[e] = c[e]);
       }
-    }
-    return R(f, () => n.current), null;
+    }, [n, r, o, i, a, c]), y(s, () => n, [n]), null;
   }
-), x = h.forwardRef(
-  ({ x: o, y: a, focalX: u, focalY: r, ...i }, f) => {
-    const { two: t } = g(), n = m(null);
-    !n.current && t && (n.current = new w.RadialGradient(
-      o,
-      a,
-      i.radius,
-      i.stops,
-      u,
-      r
-    )), l(() => {
-      n.current && (typeof o == "number" && (n.current.center.x = o), typeof a == "number" && (n.current.center.y = a));
-    }, [o, a]), l(() => {
-      n.current && (typeof u == "number" && (n.current.focal.x = u), typeof r == "number" && (n.current.focal.y = r));
-    }, [u, r]), l(e, [i]);
-    function e() {
-      if (n.current) {
-        const c = n.current;
-        for (const d in i)
-          d in c && (c[d] = i[d]);
+), Y = w.forwardRef(
+  ({ x: r, y: o, focalX: i, focalY: a, ...c }, s) => {
+    const n = P(() => new m.RadialGradient(), []);
+    return l(() => {
+      if (n) {
+        const t = n;
+        typeof r == "number" && (n.center.x = r), typeof o == "number" && (n.center.y = o), typeof i == "number" && (n.focal.x = i), typeof a == "number" && (n.focal.y = a);
+        for (const e in c)
+          e in t && (t[e] = c[e]);
       }
-    }
-    return R(f, () => n.current), null;
+    }, [c, n, r, o, i, a]), y(s, () => n, [n]), null;
   }
-), X = h.forwardRef(
-  ({ source: o, ...a }, u) => {
-    const r = m(null);
-    l(() => {
-      const f = new w.Texture(o);
-      return r.current = f, () => {
+), x = w.forwardRef(
+  ({ source: r, ...o }, i) => {
+    const [a, c] = b(null);
+    return l(() => {
+      const s = new m.Texture(r);
+      return c(s), () => {
+        c(null);
       };
-    }, [o]), l(i, [a]);
-    function i() {
-      if (r.current) {
-        const f = r.current;
-        for (const t in a)
-          t in f && (f[t] = a[t]);
+    }, [r]), l(() => {
+      if (a) {
+        const s = a;
+        for (const n in o)
+          n in s && (s[n] = o[n]);
       }
-    }
-    return R(u, () => r.current), null;
+    }, [o, a]), y(i, () => a, [a]), null;
   }
 );
 export {
-  J as ArcSegment,
+  B as ArcSegment,
   H as Canvas,
-  K as Circle,
-  E as Context,
-  M as Ellipse,
-  O as Group,
-  N as ImageSequence,
-  Q as Line,
-  D as LinearGradient,
-  _ as Path,
-  z as Points,
-  U as Polygon,
-  x as RadialGradient,
-  V as Rectangle,
-  W as RoundedRectangle,
-  Z as Sprite,
-  $ as Star,
-  B as Text,
-  X as Texture,
+  J as Circle,
+  C as Context,
+  K as Ellipse,
+  M as Group,
+  N as Image,
+  Q as ImageSequence,
+  U as Line,
+  X as LinearGradient,
+  O as Path,
+  _ as Points,
+  V as Polygon,
+  Y as RadialGradient,
+  W as Rectangle,
+  Z as RoundedRectangle,
+  $ as Sprite,
+  D as Star,
+  z as Text,
+  x as Texture,
   j as useFrame,
-  g as useTwo
+  h as useTwo
 };