@wandelbots/wandelbots-js-react-components 4.2.0 → 4.3.0-pr.feat-RB-3171-dynamic-motion-visualization.517.a2d76ef

package/dist/{MotionGroupVisualizer-CrLamHYm.js → MotionGroupVisualizer-DzSF9oW7.js}

@@ -1,16 +1,16 @@
-import { j as t, e as I } from "./externalizeComponent-Dc3fViZA.js";
+import { j as t, e as P } from "./externalizeComponent-Dc3fViZA.js";
 import * as x from "three";
-import { Matrix4 as w, Vector3 as F, Quaternion as z } from "three";
+import { Matrix4 as w, Vector3 as L, Quaternion as z } from "three";
 import { ConvexGeometry as te } from "three-stdlib";
-import { useThree as ne, useFrame as re, Canvas as N } from "@react-three/fiber";
-import { Environment as ve, Lightformer as G, Line as O, useGLTF as Me, Bounds as H } from "@react-three/drei";
-import { useTheme as _e, Card as Ae, Box as b, Typography as Y, Divider as q, Button as X } from "@mui/material";
+import { useThree as ne, useFrame as re, Canvas as H } from "@react-three/fiber";
+import { Environment as Re, Lightformer as V, Line as U, useGLTF as ve, Bounds as Y } from "@react-three/drei";
+import { useTheme as Me, Card as _e, Box as b, Typography as q, Divider as X, Button as K } from "@mui/material";
 import { observer as Te } from "mobx-react-lite";
-import Fe, { useRef as R, useEffect as _, useCallback as M, useState as T, Suspense as oe, useMemo as Ge } from "react";
-import { useTranslation as Se } from "react-i18next";
-import { N as se, V as ie, c as ae, b as Z, M as v } from "./interpolation-Cs2pC1zE.js";
-import { ErrorBoundary as le } from "react-error-boundary";
-function ke(e) {
+import Le, { useRef as R, useEffect as T, useCallback as _, useState as G, Suspense as oe, useMemo as Ve } from "react";
+import { useTranslation as Ge } from "react-i18next";
+import { N as ke, V as se, c as ie, b as Z, M as v } from "./interpolation-6ZZN4S_x.js";
+import { ErrorBoundary as ae } from "react-error-boundary";
+function Fe(e) {
   switch (e.shape_type) {
     case "convex_hull":
       return new te(
@@ -47,13 +47,13 @@ function ke(e) {
       return console.warn(`${e.shape_type} is not supported`), new x.BufferGeometry();
   }
 }
-function Le({
+function Ie({
   name: e,
   collider: r,
   children: n
 }) {
-  var u, a;
-  const i = ((u = r.pose) == null ? void 0 : u.position) ?? [0, 0, 0], o = ((a = r.pose) == null ? void 0 : a.orientation) ?? [0, 0, 0];
+  var u, l;
+  const i = ((u = r.pose) == null ? void 0 : u.position) ?? [0, 0, 0], o = ((l = r.pose) == null ? void 0 : l.orientation) ?? [0, 0, 0];
   return r.margin && console.warn(`${e} margin is not supported`), /* @__PURE__ */ t.jsx(
     "mesh",
     {
@@ -64,19 +64,19 @@ function Le({
         i[2]
       ).divideScalar(1e3),
       rotation: new x.Euler(o[0], o[1], o[2], "XYZ"),
-      geometry: ke(r.shape),
+      geometry: Fe(r.shape),
       children: n
     }
   );
 }
-function Ve({
+function Se({
   name: e,
   colliders: r,
   meshChildrenProvider: n,
   ...i
 }) {
   return /* @__PURE__ */ t.jsx("group", { name: e, ...i, children: Object.entries(r).map(([o, u]) => /* @__PURE__ */ t.jsx(
-    Le,
+    Ie,
     {
       name: o,
       collider: u,
@@ -91,7 +91,7 @@ function rt({
 }) {
   const n = e.colliders;
   return /* @__PURE__ */ t.jsx("group", { children: n && /* @__PURE__ */ t.jsx(
-    Ve,
+    Se,
     {
       meshChildrenProvider: r,
       colliders: n
@@ -99,12 +99,12 @@ function rt({
   ) });
 }
 function Q() {
-  return /* @__PURE__ */ t.jsx(ve, { children: /* @__PURE__ */ t.jsx(Pe, {}) });
+  return /* @__PURE__ */ t.jsx(Re, { children: /* @__PURE__ */ t.jsx(Ae, {}) });
 }
-function Pe({ positions: e = [2, 0, 2, 0, 2, 0, 2, 0] }) {
+function Ae({ positions: e = [2, 0, 2, 0, 2, 0, 2, 0] }) {
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsx(
-      G,
+      V,
       {
         intensity: 5,
         "rotation-x": Math.PI / 2,
@@ -113,7 +113,7 @@ function Pe({ positions: e = [2, 0, 2, 0, 2, 0, 2, 0] }) {
       }
     ),
     /* @__PURE__ */ t.jsx("group", { rotation: [0, 0.5, 0], children: /* @__PURE__ */ t.jsx("group", { children: e.map((r, n) => /* @__PURE__ */ t.jsx(
-      G,
+      V,
       {
         form: "circle",
         intensity: 5,
@@ -124,7 +124,7 @@ function Pe({ positions: e = [2, 0, 2, 0, 2, 0, 2, 0] }) {
       n
     )) }) }),
     /* @__PURE__ */ t.jsx(
-      G,
+      V,
       {
         intensity: 40,
         "rotation-y": Math.PI / 2,
@@ -133,7 +133,7 @@ function Pe({ positions: e = [2, 0, 2, 0, 2, 0, 2, 0] }) {
       }
     ),
     /* @__PURE__ */ t.jsx(
-      G,
+      V,
       {
         intensity: 20,
         "rotation-y": -Math.PI,
@@ -142,7 +142,7 @@ function Pe({ positions: e = [2, 0, 2, 0, 2, 0, 2, 0] }) {
       }
     ),
     /* @__PURE__ */ t.jsx(
-      G,
+      V,
       {
         "rotation-y": Math.PI / 2,
         position: [-5, -1, -1],
@@ -151,7 +151,7 @@ function Pe({ positions: e = [2, 0, 2, 0, 2, 0, 2, 0] }) {
       }
     ),
     /* @__PURE__ */ t.jsx(
-      G,
+      V,
       {
         "rotation-y": -Math.PI / 2,
         position: [10, 1, 0],
@@ -160,7 +160,7 @@ function Pe({ positions: e = [2, 0, 2, 0, 2, 0, 2, 0] }) {
       }
     ),
     /* @__PURE__ */ t.jsx(
-      G,
+      V,
       {
         form: "ring",
         color: "white",
@@ -172,16 +172,16 @@ function Pe({ positions: e = [2, 0, 2, 0, 2, 0, 2, 0] }) {
     )
   ] });
 }
-function Ie(e) {
+function Pe(e) {
   if (e.length < 3)
     return console.log("Not enough vertices to define a plane"), { isCoplanar: !1 };
-  const r = new x.Vector3(e[0].x, e[0].y, e[0].z), n = new x.Vector3(e[1].x, e[1].y, e[1].z), i = new x.Vector3(e[2].x, e[2].y, e[2].z), o = new x.Vector3().subVectors(n, r), u = new x.Vector3().subVectors(i, r), a = new x.Vector3().crossVectors(o, u).normalize();
+  const r = new x.Vector3(e[0].x, e[0].y, e[0].z), n = new x.Vector3(e[1].x, e[1].y, e[1].z), i = new x.Vector3(e[2].x, e[2].y, e[2].z), o = new x.Vector3().subVectors(n, r), u = new x.Vector3().subVectors(i, r), l = new x.Vector3().crossVectors(o, u).normalize();
   for (let f = 3; f < e.length; f++) {
-    const l = new x.Vector3(e[f].x, e[f].y, e[f].z), d = new x.Vector3().subVectors(l, r), m = a.dot(d);
-    if (Math.abs(m) > 1e-6)
+    const c = new x.Vector3(e[f].x, e[f].y, e[f].z), d = new x.Vector3().subVectors(c, r), h = l.dot(d);
+    if (Math.abs(h) > 1e-6)
       return console.log("Vertices are not on the same plane"), { isCoplanar: !1 };
   }
-  return { isCoplanar: !0, normal: a };
+  return { isCoplanar: !0, normal: l };
 }
 function ot({
   safetyZones: e,
@@ -189,23 +189,23 @@ function ot({
 }) {
   return /* @__PURE__ */ t.jsx("group", { ...r, children: e.map((n, i) => {
     let o = [];
-    return n.geometry && (n.geometry.compound ? o = n.geometry.compound.child_geometries : n.geometry.convex_hull && (o = [n.geometry])), o.map((u, a) => {
+    return n.geometry && (n.geometry.compound ? o = n.geometry.compound.child_geometries : n.geometry.convex_hull && (o = [n.geometry])), o.map((u, l) => {
       if (!u.convex_hull) return null;
       const f = u.convex_hull.vertices.map(
-        (m) => new x.Vector3(m.x / 1e3, m.y / 1e3, m.z / 1e3)
-      ), l = Ie(f);
-      if (l.isCoplanar && l.normal) {
+        (h) => new x.Vector3(h.x / 1e3, h.y / 1e3, h.z / 1e3)
+      ), c = Pe(f);
+      if (c.isCoplanar && c.normal) {
         const s = new x.Vector3().addVectors(
           f[0],
-          l.normal.multiplyScalar(1e-4)
+          c.normal.multiplyScalar(1e-4)
         );
         f.push(s);
       }
       let d;
       try {
         d = new te(f);
-      } catch (m) {
-        return console.log("Error creating ConvexGeometry:", m), null;
+      } catch (h) {
+        return console.log("Error creating ConvexGeometry:", h), null;
       }
       return /* @__PURE__ */ t.jsx("mesh", { geometry: d, children: /* @__PURE__ */ t.jsx(
         "meshStandardMaterial",
@@ -217,10 +217,10 @@ function ot({
           depthWrite: !1,
           transparent: !0,
           polygonOffset: !0,
-          polygonOffsetFactor: -a
+          polygonOffsetFactor: -l
         },
         i
-      ) }, `${i}-${a}`);
+      ) }, `${i}-${l}`);
     });
   }) });
 }
@@ -235,7 +235,7 @@ function st({
     -o.tcp_pose.position.y / 1e3
   ) : null).filter((o) => o !== null)) || [];
   return /* @__PURE__ */ t.jsx("group", { ...r, children: n.length > 0 && /* @__PURE__ */ t.jsx(
-    O,
+    U,
     {
       points: n,
       lineWidth: 3,
@@ -245,16 +245,16 @@ function st({
     }
   ) });
 }
-const C = /* @__PURE__ */ new Map();
-async function U(e, r) {
-  if (C.has(e))
-    return C.get(e);
+const O = /* @__PURE__ */ new Map();
+async function C(e, r) {
+  if (O.has(e))
+    return O.get(e);
   const n = (async () => {
-    var a;
-    const i = r || "", o = new se({ instanceUrl: i }), u = o.api.motionGroupModels;
-    (a = u.axios) != null && a.interceptors && u.axios.interceptors.request.use((f) => {
-      var l;
-      return (l = f.url) != null && l.includes("/glb") && (f.responseType = "blob"), f;
+    var l;
+    const i = r || "", o = new ke({ instanceUrl: i }), u = o.api.motionGroupModels;
+    (l = u.axios) != null && l.interceptors && u.axios.interceptors.request.use((f) => {
+      var c;
+      return (c = f.url) != null && c.includes("/glb") && (f.responseType = "blob"), f;
     });
     try {
       const f = await o.api.motionGroupModels.getMotionGroupGlbModel(e);
@@ -263,31 +263,31 @@ async function U(e, r) {
       throw console.error("Failed to fetch model:", f), f;
     }
   })();
-  return C.set(e, n), n;
+  return O.set(e, n), n;
 }
-function ce(e) {
+function le(e) {
   function r(n) {
     return n.children.length === 0 ? [n] : [n, ...n.children.flatMap((i) => r(i))];
   }
-  return r(e).filter((n) => fe(n));
+  return r(e).filter((n) => ue(n));
 }
-function ue(e) {
+function ce(e) {
   return e.name.endsWith("_FLG");
 }
-function fe(e) {
+function ue(e) {
   return /_J[0-9]+$/.test(e.name);
 }
-function Ue(e, r) {
+function Ce(e, r) {
   let n;
   function i(o) {
-    if (ue(o)) {
+    if (ce(o)) {
       if (n)
         throw Error(
           `Found multiple flange groups in robot model ${r}; first ${n.name} then ${o.name}. Only one _FLG group is allowed.`
         );
       n = o;
     }
-    fe(o), o.children.map(i);
+    ue(o), o.children.map(i);
   }
   if (i(e.scene), !n)
     throw Error(
@@ -295,121 +295,121 @@ function Ue(e, r) {
     );
   return { gltf: e };
 }
-function de({
+function fe({
   rapidlyChangingMotionState: e,
   dhParameters: r,
   onRotationChanged: n,
   children: i
 }) {
-  const o = R([]), u = R([]), a = R(null), { invalidate: f } = ne();
-  _(() => {
+  const o = R([]), u = R([]), l = R(null), { invalidate: f } = ne();
+  T(() => {
     const s = e.joint_position.filter(
-      (c) => c !== void 0
+      (a) => a !== void 0
     );
-    return a.current = new ie(s, {
+    return l.current = new se(s, {
       tension: 120,
       // Controls spring stiffness - higher values create faster, more responsive motion
       friction: 20,
       // Controls damping - higher values reduce oscillation and create smoother settling
       threshold: 1e-3
     }), () => {
-      var c;
-      (c = a.current) == null || c.destroy();
+      var a;
+      (a = l.current) == null || a.destroy();
     };
-  }, []), re((s, c) => {
-    if (a.current) {
-      const h = a.current.update(c);
-      d(), h || f();
+  }, []), re((s, a) => {
+    if (l.current) {
+      const m = l.current.update(a);
+      d(), m || f();
     }
   });
-  function l(s) {
-    s && (u.current = ce(s), d(), f());
+  function c(s) {
+    s && (u.current = le(s), d(), f());
   }
   function d() {
-    var c;
-    const s = ((c = a.current) == null ? void 0 : c.getCurrentValues()) || [];
+    var a;
+    const s = ((a = l.current) == null ? void 0 : a.getCurrentValues()) || [];
     if (n)
       n(u.current, s);
     else
-      for (const [h, g] of u.current.entries()) {
-        const p = r[h], j = p.theta || 0, y = p.reverse_rotation_direction ? -1 : 1;
-        g.rotation.y = y * (s[h] || 0) + j;
+      for (const [m, g] of u.current.entries()) {
+        const p = r[m], j = p.theta || 0, y = p.reverse_rotation_direction ? -1 : 1;
+        g.rotation.y = y * (s[m] || 0) + j;
       }
   }
-  const m = M(() => {
+  const h = _(() => {
     const s = e.joint_position.filter(
-      (c) => c !== void 0
+      (a) => a !== void 0
     );
     requestAnimationFrame(() => {
-      var c;
-      o.current = s, (c = a.current) == null || c.setTarget(s);
+      var a;
+      o.current = s, (a = l.current) == null || a.setTarget(s);
     });
   }, [e]);
-  return _(() => {
-    m();
-  }, [e, m]), ae(() => {
-    m();
-  }), /* @__PURE__ */ t.jsx("group", { ref: l, children: i });
+  return T(() => {
+    h();
+  }, [e, h]), ie(() => {
+    h();
+  }), /* @__PURE__ */ t.jsx("group", { ref: c, children: i });
 }
-const De = "line", Ce = "mesh";
+const De = "line", Oe = "mesh";
 function ze({
   rapidlyChangingMotionState: e,
   dhParameters: r,
   ...n
 }) {
   const i = new w(), o = R([]), u = R([]);
-  Fe.useEffect(() => {
+  Le.useEffect(() => {
     o.current = new Array(r.length).fill(null), u.current = new Array(r.length).fill(null);
   }, [r.length]);
-  function a(d, m) {
-    const s = new F(), c = new z(), h = new F();
-    i.decompose(s, c, h);
+  function l(d, h) {
+    const s = new L(), a = new z(), m = new L();
+    i.decompose(s, a, m);
     const g = s.clone(), p = new w().makeRotationY(
-      d.theta + m * (d.reverse_rotation_direction ? -1 : 1)
+      d.theta + h * (d.reverse_rotation_direction ? -1 : 1)
     ).multiply(new w().makeTranslation(0, d.d / 1e3, 0)).multiply(new w().makeTranslation(d.a / 1e3, 0, 0)).multiply(new w().makeRotationX(d.alpha));
-    return i.multiply(p), i.decompose(s, c, h), { a: g, b: s };
+    return i.multiply(p), i.decompose(s, a, m), { a: g, b: s };
   }
-  function f(d, m, s, c) {
+  function f(d, h, s, a) {
     if (!r)
       return;
-    const h = r[d];
-    if (!h)
+    const m = r[d];
+    if (!m)
       return;
-    const { a: g, b: p } = a(h, c);
-    m.geometry.setPositions([g.toArray(), p.toArray()].flat()), s.position.set(p.x, p.y, p.z);
+    const { a: g, b: p } = l(m, a);
+    h.geometry.setPositions([g.toArray(), p.toArray()].flat()), s.position.set(p.x, p.y, p.z);
   }
-  function l(d, m) {
+  function c(d, h) {
     i.identity();
-    for (let s = 0; s < Math.min(d.length, m.length); s++) {
-      const c = o.current[s], h = u.current[s];
-      c && h && f(s, c, h, m[s]);
+    for (let s = 0; s < Math.min(d.length, h.length); s++) {
+      const a = o.current[s], m = u.current[s];
+      a && m && f(s, a, m, h[s]);
     }
   }
   return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsx(
-    de,
+    fe,
     {
       rapidlyChangingMotionState: e,
       dhParameters: r,
-      onRotationChanged: l,
+      onRotationChanged: c,
       children: /* @__PURE__ */ t.jsxs("group", { ...n, name: "Scene", children: [
         /* @__PURE__ */ t.jsxs("mesh", { children: [
           /* @__PURE__ */ t.jsx("sphereGeometry", { args: [0.01, 32, 32] }),
           /* @__PURE__ */ t.jsx("meshStandardMaterial", { color: "black", depthTest: !0 })
         ] }),
-        r.map((d, m) => {
-          const { a: s, b: c } = a(
+        r.map((d, h) => {
+          const { a: s, b: a } = l(
             d,
-            e.joint_position[m] ?? 0
-          ), h = `dhrobot_J0${m}`;
-          return /* @__PURE__ */ t.jsxs("group", { name: h, children: [
+            e.joint_position[h] ?? 0
+          ), m = `dhrobot_J0${h}`;
+          return /* @__PURE__ */ t.jsxs("group", { name: m, children: [
             /* @__PURE__ */ t.jsx(
-              O,
+              U,
               {
                 ref: (g) => {
-                  o.current[m] = g;
+                  o.current[h] = g;
                 },
                 name: De,
-                points: [s, c],
+                points: [s, a],
                 color: "white",
                 lineWidth: 5
               }
@@ -418,28 +418,28 @@ function ze({
               "mesh",
               {
                 ref: (g) => {
-                  u.current[m] = g;
+                  u.current[h] = g;
                 },
-                name: Ce,
-                position: c,
+                name: Oe,
+                position: a,
                 children: [
                   /* @__PURE__ */ t.jsx("sphereGeometry", { args: [0.01, 32, 32] }),
                   /* @__PURE__ */ t.jsx("meshStandardMaterial", { color: "black", depthTest: !0 })
                 ]
               },
-              "mesh_" + m
+              "mesh_" + h
             )
-          ] }, h);
+          ] }, m);
         })
       ] })
     }
   ) });
 }
-const Oe = console.warn;
-function me() {
-  return _(() => {
+const Ue = console.warn;
+function de() {
+  return T(() => {
     console.warn = (e) => {
-      e !== "Cannot call the manual advancement of rafz whilst frameLoop is not set as demand" && Oe(e);
+      e !== "Cannot call the manual advancement of rafz whilst frameLoop is not set as demand" && Ue(e);
     };
   }, []), /* @__PURE__ */ t.jsx(t.Fragment, {});
 }
@@ -452,56 +452,56 @@ function Be({
   postModelRender: n,
   ...i
 }) {
-  const o = Me(e);
+  const o = ve(e);
   let u;
   try {
-    u = Ue(o, "robot.glb").gltf;
-  } catch (l) {
-    throw l;
+    u = Ce(o, "robot.glb").gltf;
+  } catch (c) {
+    throw c;
   }
-  const a = M(
-    (l) => {
-      l && n && n();
+  const l = _(
+    (c) => {
+      c && n && n();
     },
     [n]
   );
-  function f(l) {
+  function f(c) {
     try {
-      return Ee(l) ? l.geometry ? /* @__PURE__ */ t.jsx(
+      return Ee(c) ? c.geometry ? /* @__PURE__ */ t.jsx(
         "mesh",
         {
-          name: l.name,
-          geometry: l.geometry,
-          material: l.material,
-          position: l.position,
-          rotation: l.rotation
+          name: c.name,
+          geometry: c.geometry,
+          material: c.material,
+          position: c.position,
+          rotation: c.rotation
         },
-        l.uuid
-      ) : /* @__PURE__ */ t.jsx("group", { name: l.name, position: l.position, rotation: l.rotation }, l.uuid) : /* @__PURE__ */ t.jsx(
+        c.uuid
+      ) : /* @__PURE__ */ t.jsx("group", { name: c.name, position: c.position, rotation: c.rotation }, c.uuid) : /* @__PURE__ */ t.jsx(
         "group",
         {
-          name: l.name,
-          position: l.position,
-          rotation: l.rotation,
-          ref: ue(l) ? r : void 0,
-          children: l.children.map(f)
+          name: c.name,
+          position: c.position,
+          rotation: c.rotation,
+          ref: ce(c) ? r : void 0,
+          children: c.children.map(f)
         },
-        l.uuid
+        c.uuid
       );
     } catch (d) {
-      return console.warn("Error rendering node", l.name, d), null;
+      return console.warn("Error rendering node", c.name, d), null;
     }
   }
-  return /* @__PURE__ */ t.jsx("group", { ...i, dispose: null, ref: a, children: f(u.scene) });
+  return /* @__PURE__ */ t.jsx("group", { ...i, dispose: null, ref: l, children: f(u.scene) });
 }
-function he({
+function me({
   modelURL: e,
   flangeRef: r,
   postModelRender: n,
   ...i
 }) {
-  const [o, u] = T(null);
-  return _(() => {
+  const [o, u] = G(null);
+  return T(() => {
     (async () => {
       try {
         if (typeof e == "string")
@@ -524,7 +524,7 @@ function he({
     }
   ) : null;
 }
-const pe = (e, r) => {
+const he = (e, r) => {
   e.userData.isGhost || (e.traverse((n) => {
     if (n instanceof x.Mesh) {
       n.material instanceof x.Material && (n.material.colorWrite = !1);
@@ -548,7 +548,7 @@ const pe = (e, r) => {
       }), o.userData.isGhost = !0, n.parent && (n.parent.add(i), n.parent.add(o));
     }
   }), e.userData.isGhost = !0);
-}, xe = (e) => {
+}, pe = (e) => {
   if (!e.userData.isGhost) return;
   const r = [];
   e.traverse((n) => {
@@ -557,64 +557,64 @@ const pe = (e, r) => {
   }), r.forEach((n) => {
     n.parent && n.parent.remove(n);
   }), e.userData.isGhost = !1;
-}, ge = I(
+}, xe = P(
   ({
     rapidlyChangingMotionState: e,
     modelFromController: r,
     dhParameters: n,
-    getModel: i = U,
+    getModel: i = C,
     flangeRef: o,
     postModelRender: u,
-    transparentColor: a,
+    transparentColor: l,
     instanceUrl: f,
-    ...l
+    ...c
   }) => {
-    const [d, m] = T(null), s = M((h) => {
-      m(h);
+    const [d, h] = G(null), s = _((m) => {
+      h(m);
     }, []);
-    _(() => {
-      d && (a ? pe(d, a) : xe(d));
-    }, [d, a]);
-    const c = /* @__PURE__ */ t.jsx(
+    T(() => {
+      d && (l ? he(d, l) : pe(d));
+    }, [d, l]);
+    const a = /* @__PURE__ */ t.jsx(
       ze,
       {
         rapidlyChangingMotionState: e,
         dhParameters: n,
-        ...l
+        ...c
       }
     );
     return /* @__PURE__ */ t.jsxs(
-      le,
+      ae,
       {
-        fallback: c,
-        onError: (h) => {
-          console.warn(h);
+        fallback: a,
+        onError: (m) => {
+          console.warn(m);
         },
         children: [
-          /* @__PURE__ */ t.jsx(oe, { fallback: c, children: /* @__PURE__ */ t.jsx("group", { ref: s, children: /* @__PURE__ */ t.jsx(
-            de,
+          /* @__PURE__ */ t.jsx(oe, { fallback: a, children: /* @__PURE__ */ t.jsx("group", { ref: s, children: /* @__PURE__ */ t.jsx(
+            fe,
             {
               rapidlyChangingMotionState: e,
               dhParameters: n,
               children: /* @__PURE__ */ t.jsx(
-                he,
+                me,
                 {
                   modelURL: (() => {
-                    const h = i(r, f);
-                    if (!h) {
+                    const m = i(r, f);
+                    if (!m) {
                       const g = new Blob([], { type: "model/gltf-binary" }), p = new File([g], `${r}.glb`, { type: "model/gltf-binary" });
                       return Promise.resolve(URL.createObjectURL(p));
                     }
-                    return h;
+                    return m;
                   })(),
                   postModelRender: u,
                   flangeRef: o,
-                  ...l
+                  ...c
                 }
               )
             }
           ) }) }),
-          /* @__PURE__ */ t.jsx(me, {})
+          /* @__PURE__ */ t.jsx(de, {})
         ]
       }
     );
@@ -622,14 +622,14 @@ const pe = (e, r) => {
 );
 function We({
   connectedMotionGroup: e,
-  getModel: r = U,
+  getModel: r = C,
   flangeRef: n,
   transparentColor: i,
   postModelRender: o,
   ...u
 }) {
   return e.dhParameters ? /* @__PURE__ */ t.jsx(
-    ge,
+    xe,
     {
       rapidlyChangingMotionState: e.rapidlyChangingMotionState,
       modelFromController: e.modelFromController || "",
@@ -642,7 +642,7 @@ function We({
     }
   ) : null;
 }
-const it = I(
+const it = P(
   Te(
     ({
       robotName: e,
@@ -651,41 +651,41 @@ const it = I(
       operationMode: i,
       driveToHomeEnabled: o = !1,
       onDriveToHomePress: u,
-      onDriveToHomeRelease: a,
+      onDriveToHomeRelease: l,
       connectedMotionGroup: f,
-      robotComponent: l = We,
+      robotComponent: c = We,
       customContentComponent: d,
-      className: m
+      className: h
     }) => {
       var W;
-      const s = _e(), { t: c } = Se(), [h, g] = T(!1), p = R(null), j = R(null), [y, D] = T(!1), [S, be] = T({ width: 400, height: 600 }), [$e, Re] = T(0);
-      _(() => {
-        const P = () => {
+      const s = Me(), { t: a } = Ge(), [m, g] = G(!1), p = R(null), j = R(null), [y, D] = G(!1), [k, we] = G({ width: 400, height: 600 }), [$e, be] = G(0);
+      T(() => {
+        const A = () => {
           if (j.current) {
-            const { offsetWidth: $, offsetHeight: J } = j.current;
-            D($ > J), be({ width: $, height: J });
+            const { offsetWidth: $, offsetHeight: N } = j.current;
+            D($ > N), we({ width: $, height: N });
           }
         };
-        P();
-        const K = new ResizeObserver(P);
-        return j.current && K.observe(j.current), () => {
-          K.disconnect();
+        A();
+        const J = new ResizeObserver(A);
+        return j.current && J.observe(j.current), () => {
+          J.disconnect();
         };
       }, []);
-      const E = M(() => {
-        Re((P) => P + 1);
-      }, []), k = M(() => {
+      const E = _(() => {
+        be((A) => A + 1);
+      }, []), F = _(() => {
         !o || !u || (g(!0), u());
-      }, [o, u]), L = M(() => {
-        !o || !a || (g(!1), a());
-      }, [o, a]), B = M(() => {
-        h && a && (g(!1), a());
-      }, [h, a]), A = y ? S.width < 350 : S.height < 200, V = y ? S.height < 310 : S.height < 450;
+      }, [o, u]), I = _(() => {
+        !o || !l || (g(!1), l());
+      }, [o, l]), B = _(() => {
+        m && l && (g(!1), l());
+      }, [m, l]), M = y ? k.width < 350 : k.height < 200, S = y ? k.height < 310 : k.height < 450;
       return /* @__PURE__ */ t.jsx(
-        Ae,
+        _e,
         {
           ref: j,
-          className: m,
+          className: h,
           sx: {
             width: "100%",
             height: "100%",
@@ -718,10 +718,10 @@ const it = I(
                   mr: { xs: 0.75, sm: 1, md: 1.5 },
                   overflow: "hidden",
                   // Prevent content from affecting container size
-                  display: A ? "none" : "block"
+                  display: M ? "none" : "block"
                 },
-                children: !A && /* @__PURE__ */ t.jsxs(
-                  N,
+                children: !M && /* @__PURE__ */ t.jsxs(
+                  H,
                   {
                     orthographic: !0,
                     camera: {
@@ -743,8 +743,8 @@ const it = I(
                     gl: { alpha: !0, antialias: !0 },
                     children: [
                       /* @__PURE__ */ t.jsx(Q, {}),
-                      /* @__PURE__ */ t.jsx(H, { fit: !0, observe: !0, margin: 1, maxDuration: 1, children: /* @__PURE__ */ t.jsx(
-                        l,
+                      /* @__PURE__ */ t.jsx(Y, { fit: !0, observe: !0, margin: 1, maxDuration: 1, children: /* @__PURE__ */ t.jsx(
+                        c,
                         {
                           connectedMotionGroup: f,
                           postModelRender: E
@@ -763,7 +763,7 @@ const it = I(
                   display: "flex",
                   flexDirection: "column",
                   justifyContent: "flex-start",
-                  width: A ? "100%" : "50%"
+                  width: M ? "100%" : "50%"
                 },
                 children: [
                   /* @__PURE__ */ t.jsxs(
@@ -775,7 +775,7 @@ const it = I(
                         textAlign: "left"
                       },
                       children: [
-                        /* @__PURE__ */ t.jsx(Y, { variant: "h6", component: "h2", sx: { mb: 1 }, children: e }),
+                        /* @__PURE__ */ t.jsx(q, { variant: "h6", component: "h2", sx: { mb: 1 }, children: e }),
                         /* @__PURE__ */ t.jsx(
                           Z,
                           {
@@ -799,10 +799,10 @@ const it = I(
                         justifyContent: "space-between"
                       },
                       children: [
-                        !V && d && /* @__PURE__ */ t.jsxs(b, { children: [
+                        !S && d && /* @__PURE__ */ t.jsxs(b, { children: [
                           /* @__PURE__ */ t.jsx(d, {}),
                           /* @__PURE__ */ t.jsx(
-                            q,
+                            X,
                             {
                               sx: {
                                 mt: 1,
@@ -817,7 +817,7 @@ const it = I(
                           b,
                           {
                             sx: {
-                              mt: !V && d ? "auto" : 0
+                              mt: !S && d ? "auto" : 0
                             },
                             children: /* @__PURE__ */ t.jsx(
                               b,
@@ -829,24 +829,24 @@ const it = I(
                                   mb: { xs: 0.5, sm: 0.75, md: 1 }
                                 },
                                 children: /* @__PURE__ */ t.jsx(
-                                  X,
+                                  K,
                                   {
                                     ref: p,
                                     variant: "contained",
                                     color: "secondary",
                                     size: "small",
                                     disabled: !o,
-                                    onMouseDown: k,
-                                    onMouseUp: L,
+                                    onMouseDown: F,
+                                    onMouseUp: I,
                                     onMouseLeave: B,
-                                    onTouchStart: k,
-                                    onTouchEnd: L,
+                                    onTouchStart: F,
+                                    onTouchEnd: I,
                                     sx: {
                                       textTransform: "none",
                                       px: 1.5,
                                       py: 0.5
                                     },
-                                    children: c("RobotCard.DriveToHome.bt")
+                                    children: a("RobotCard.DriveToHome.bt")
                                   }
                                 )
                               }
@@ -870,7 +870,7 @@ const it = I(
               },
               children: [
                 /* @__PURE__ */ t.jsxs(b, { children: [
-                  /* @__PURE__ */ t.jsx(Y, { variant: "h6", component: "h2", sx: { mb: 1 }, children: e }),
+                  /* @__PURE__ */ t.jsx(q, { variant: "h6", component: "h2", sx: { mb: 1 }, children: e }),
                   /* @__PURE__ */ t.jsx(
                     Z,
                     {
@@ -884,16 +884,16 @@ const it = I(
                   b,
                   {
                     sx: {
-                      flex: A ? 0 : 1,
+                      flex: M ? 0 : 1,
                       position: "relative",
-                      minHeight: A ? 0 : { xs: 120, sm: 150, md: 200 },
-                      height: A ? 0 : "auto",
+                      minHeight: M ? 0 : { xs: 120, sm: 150, md: 200 },
+                      height: M ? 0 : "auto",
                       borderRadius: 1,
                       overflow: "hidden",
-                      display: A ? "none" : "block"
+                      display: M ? "none" : "block"
                     },
-                    children: !A && /* @__PURE__ */ t.jsxs(
-                      N,
+                    children: !M && /* @__PURE__ */ t.jsxs(
+                      H,
                       {
                         orthographic: !0,
                         camera: {
@@ -913,8 +913,8 @@ const it = I(
                         gl: { alpha: !0, antialias: !0 },
                         children: [
                           /* @__PURE__ */ t.jsx(Q, {}),
-                          /* @__PURE__ */ t.jsx(H, { fit: !0, clip: !0, observe: !0, margin: 1, maxDuration: 1, children: /* @__PURE__ */ t.jsx(
-                            l,
+                          /* @__PURE__ */ t.jsx(Y, { fit: !0, clip: !0, observe: !0, margin: 1, maxDuration: 1, children: /* @__PURE__ */ t.jsx(
+                            c,
                             {
                               connectedMotionGroup: f,
                               postModelRender: E
@@ -926,10 +926,10 @@ const it = I(
                   }
                 ),
                 /* @__PURE__ */ t.jsxs(b, { children: [
-                  !V && d && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+                  !S && d && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
                     /* @__PURE__ */ t.jsx(d, {}),
                     /* @__PURE__ */ t.jsx(
-                      q,
+                      X,
                       {
                         sx: {
                           mt: 1,
@@ -946,28 +946,28 @@ const it = I(
                       sx: {
                         display: "flex",
                         justifyContent: "flex-start",
-                        mt: !V && d ? { xs: 1, sm: 2, md: 5 } : { xs: 0.5, sm: 1, md: 2 },
+                        mt: !S && d ? { xs: 1, sm: 2, md: 5 } : { xs: 0.5, sm: 1, md: 2 },
                         mb: { xs: 0.5, sm: 0.75, md: 1 }
                       },
                       children: /* @__PURE__ */ t.jsx(
-                        X,
+                        K,
                         {
                           ref: p,
                           variant: "contained",
                           color: "secondary",
                           size: "small",
                           disabled: !o,
-                          onMouseDown: k,
-                          onMouseUp: L,
+                          onMouseDown: F,
+                          onMouseUp: I,
                           onMouseLeave: B,
-                          onTouchStart: k,
-                          onTouchEnd: L,
+                          onTouchStart: F,
+                          onTouchEnd: I,
                           sx: {
                             textTransform: "none",
                             px: 1.5,
                             py: 0.5
                           },
-                          children: c("RobotCard.DriveToHome.bt")
+                          children: a("RobotCard.DriveToHome.bt")
                         }
                       )
                     }
@@ -981,70 +981,70 @@ const it = I(
     }
   )
 ), at = Array(6).fill(2 * Math.PI);
-function ye({
+function ge({
   rapidlyChangingMotionState: e,
   dhParameters: r,
   onTranslationChanged: n,
   children: i
 }) {
-  const o = R([]), u = R([]), a = R(null), { invalidate: f } = ne();
-  _(() => {
+  const o = R([]), u = R([]), l = R(null), { invalidate: f } = ne();
+  T(() => {
     const s = e.joint_position.filter(
-      (c) => c !== void 0
+      (a) => a !== void 0
     );
-    return a.current = new ie(s, {
+    return l.current = new se(s, {
       tension: 120,
       // Controls spring stiffness - higher values create faster, more responsive motion
       friction: 20,
       // Controls damping - higher values reduce oscillation and create smoother settling
       threshold: 1e-3
     }), () => {
-      var c;
-      (c = a.current) == null || c.destroy();
+      var a;
+      (a = l.current) == null || a.destroy();
     };
-  }, []), re((s, c) => {
-    if (a.current) {
-      const h = a.current.update(c);
-      d(), h || f();
+  }, []), re((s, a) => {
+    if (l.current) {
+      const m = l.current.update(a);
+      d(), m || f();
     }
   });
-  function l(s) {
-    s && (u.current = ce(s), d(), f());
+  function c(s) {
+    s && (u.current = le(s), d(), f());
   }
   function d() {
-    var c;
-    const s = ((c = a.current) == null ? void 0 : c.getCurrentValues()) || [];
+    var a;
+    const s = ((a = l.current) == null ? void 0 : a.getCurrentValues()) || [];
     if (n)
       n(u.current, s);
     else
-      for (const [h, g] of u.current.entries()) {
-        const j = r[h].reverse_rotation_direction ? -1 : 1;
-        g.position.y = j * (s[h] || 0) / 1e3;
+      for (const [m, g] of u.current.entries()) {
+        const j = r[m].reverse_rotation_direction ? -1 : 1;
+        g.position.y = j * (s[m] || 0) / 1e3;
       }
   }
-  const m = M(() => {
+  const h = _(() => {
     const s = e.joint_position.filter(
-      (c) => c !== void 0
+      (a) => a !== void 0
     );
     requestAnimationFrame(() => {
-      var c;
-      o.current = s, (c = a.current) == null || c.setTarget(s);
+      var a;
+      o.current = s, (a = l.current) == null || a.setTarget(s);
     });
   }, [e]);
-  return _(() => {
-    m();
-  }, [e, m]), ae(() => {
-    m();
-  }), /* @__PURE__ */ t.jsx("group", { ref: l, children: i });
+  return T(() => {
+    h();
+  }, [e, h]), ie(() => {
+    h();
+  }), /* @__PURE__ */ t.jsx("group", { ref: c, children: i });
 }
-function je({
+function ye({
   rapidlyChangingMotionState: e,
   dhParameters: r,
   ...n
 }) {
   const i = new w(), o = R(null), u = R(null);
-  function a(d) {
-    const m = new w();
+  function l(d) {
+    const h = new w();
     for (let g = 0; g < r.length; g++) {
       const p = r[g], j = d[g] ?? 0, y = new w().makeRotationY(p.theta).multiply(
         new w().makeTranslation(
@@ -1053,17 +1053,17 @@ function je({
           0
         )
       ).multiply(new w().makeRotationX(p.alpha));
-      m.multiply(y);
+      h.multiply(y);
     }
-    const s = new F(), c = new z(), h = new F();
-    return m.decompose(s, c, h), s;
+    const s = new L(), a = new z(), m = new L();
+    return h.decompose(s, a, m), s;
   }
-  const f = a(e.joint_position);
-  function l(d, m) {
+  const f = l(e.joint_position);
+  function c(d, h) {
     i.identity();
-    let s = new F();
+    let s = new L();
     for (let p = 0; p < r.length; p++) {
-      const j = m[p] ?? 0, y = r[p], D = new w().makeRotationY(y.theta).multiply(
+      const j = h[p] ?? 0, y = r[p], D = new w().makeRotationY(y.theta).multiply(
         new w().makeTranslation(
           y.a / 1e3,
           (y.d + j * (y.reverse_rotation_direction ? -1 : 1)) / 1e3,
@@ -1072,28 +1072,28 @@ function je({
       ).multiply(new w().makeRotationX(y.alpha));
       i.multiply(D);
     }
-    const c = new F(), h = new z(), g = new F();
-    if (i.decompose(c, h, g), s = c, o.current && o.current.position.set(s.x, s.y, s.z), u.current) {
+    const a = new L(), m = new z(), g = new L();
+    if (i.decompose(a, m, g), s = a, o.current && o.current.position.set(s.x, s.y, s.z), u.current) {
       const p = u.current.geometry;
       p && p.setPositions && p.setPositions([0, 0, 0, s.x, s.y, s.z]);
     }
   }
   return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsx(
-    ye,
+    ge,
     {
       rapidlyChangingMotionState: e,
       dhParameters: r,
-      onTranslationChanged: l,
+      onTranslationChanged: c,
       children: /* @__PURE__ */ t.jsxs("group", { ...n, name: "Scene", children: [
         /* @__PURE__ */ t.jsxs("mesh", { name: "Base", position: [0, 0, 0], children: [
           /* @__PURE__ */ t.jsx("sphereGeometry", { args: [0.02, 32, 32] }),
           /* @__PURE__ */ t.jsx("meshStandardMaterial", { color: "green", depthTest: !0 })
         ] }),
         /* @__PURE__ */ t.jsx(
-          O,
+          U,
           {
             ref: u,
-            points: [new F(0, 0, 0), f],
+            points: [new L(0, 0, 0), f],
             color: "White",
             lineWidth: 5
           }
@@ -1106,64 +1106,64 @@ function je({
     }
   ) });
 }
-const we = I(
+const je = P(
   ({
     rapidlyChangingMotionState: e,
     modelFromController: r,
     dhParameters: n,
-    getModel: i = U,
+    getModel: i = C,
     flangeRef: o,
     postModelRender: u,
-    transparentColor: a,
+    transparentColor: l,
     instanceUrl: f,
-    ...l
+    ...c
   }) => {
-    const [d, m] = T(null), s = M((h) => {
-      m(h);
+    const [d, h] = G(null), s = _((m) => {
+      h(m);
     }, []);
-    _(() => {
-      d && (a ? pe(d, a) : xe(d));
-    }, [d, a]);
-    const c = /* @__PURE__ */ t.jsx(
-      je,
+    T(() => {
+      d && (l ? he(d, l) : pe(d));
+    }, [d, l]);
+    const a = /* @__PURE__ */ t.jsx(
+      ye,
       {
         rapidlyChangingMotionState: e,
         dhParameters: n,
-        ...l
+        ...c
       }
     );
     return /* @__PURE__ */ t.jsxs(
-      le,
+      ae,
       {
-        fallback: c,
-        onError: (h) => {
-          console.warn(h);
+        fallback: a,
+        onError: (m) => {
+          console.warn(m);
         },
         children: [
-          /* @__PURE__ */ t.jsx(oe, { fallback: c, children: /* @__PURE__ */ t.jsx("group", { ref: s, children: /* @__PURE__ */ t.jsx(
-            ye,
+          /* @__PURE__ */ t.jsx(oe, { fallback: a, children: /* @__PURE__ */ t.jsx("group", { ref: s, children: /* @__PURE__ */ t.jsx(
+            ge,
             {
               rapidlyChangingMotionState: e,
               dhParameters: n,
               children: /* @__PURE__ */ t.jsx(
-                he,
+                me,
                 {
                   modelURL: (() => {
-                    const h = i(r, f);
-                    if (!h) {
+                    const m = i(r, f);
+                    if (!m) {
                       const g = new Blob([], { type: "model/gltf-binary" }), p = new File([g], `${r}.glb`, { type: "model/gltf-binary" });
                       return Promise.resolve(URL.createObjectURL(p));
                     }
-                    return h;
+                    return m;
                   })(),
                   postModelRender: u,
                   flangeRef: o,
-                  ...l
+                  ...c
                 }
               )
             }
           ) }) }),
-          /* @__PURE__ */ t.jsx(me, {})
+          /* @__PURE__ */ t.jsx(de, {})
         ]
       }
     );
@@ -1171,7 +1171,7 @@ const we = I(
 );
 function lt({
   connectedMotionGroup: e,
-  getModel: r = U,
+  getModel: r = C,
   flangeRef: n,
   transparentColor: i,
   postModelRender: o,
@@ -1179,12 +1179,12 @@ function lt({
 }) {
   if (!e.dhParameters)
     return null;
-  const a = e.modelFromController || "";
-  return a && r(a) ? /* @__PURE__ */ t.jsx(
-    we,
+  const l = e.modelFromController || "";
+  return l && r(l) ? /* @__PURE__ */ t.jsx(
+    je,
     {
       rapidlyChangingMotionState: e.rapidlyChangingMotionState,
-      modelFromController: a,
+      modelFromController: l,
       dhParameters: e.dhParameters,
       getModel: r,
       flangeRef: n,
@@ -1193,7 +1193,7 @@ function lt({
       ...u
     }
   ) : /* @__PURE__ */ t.jsx(
-    je,
+    ye,
     {
       rapidlyChangingMotionState: e.rapidlyChangingMotionState,
       dhParameters: e.dhParameters,
@@ -1224,7 +1224,7 @@ const ee = {
     0
   ]
 };
-function Ke(e) {
+function Je(e) {
   const [r] = e.split("_");
   switch (r) {
     case "ABB":
@@ -1242,57 +1242,16 @@ function Ke(e) {
   }
 }
 function ct(e, r) {
-  const n = Ke(e);
+  const n = Je(e);
   return n && n in ee ? ee[n] : r || null;
 }
-const ut = I((e) => {
+const ut = P((e) => {
   const {
-    instanceUrl: r,
-    inverseSolver: n,
-    modelFromController: i,
-    ...o
-  } = e, [u, a] = T(
-    n
-  ), [, f] = T(!1), l = M(async () => {
-    const m = new se({ instanceUrl: r });
-    try {
-      const s = await m.api.motionGroupModels.getMotionGroupKinematicModel(
-        i
-      );
-      a(s.inverse_solver);
-    } catch {
-      console.warn(
-        `Failed to fetch kinematic model from API for ${i}, falling back to local config`
-      );
-    } finally {
-      setTimeout(() => f(!0), 0);
-    }
-  }, [i, r]);
-  _(() => {
-    n === void 0 && !!i && !!r && l();
-  }, [n, i, l, r]);
-  const d = Ge(() => [
-    "KUKA_DKP250",
-    "KUKA_DKP500_2",
-    "YASKAWA_TURN1",
-    "YASKAWA_TURN2",
-    "YASKAWA_TURN3"
-  ].includes(i), [i]);
-  return u || d ? /* @__PURE__ */ t.jsx(
-    ge,
-    {
-      instanceUrl: r,
-      modelFromController: i,
-      ...o
-    }
-  ) : u === null ? /* @__PURE__ */ t.jsx(
-    we,
-    {
-      instanceUrl: r,
-      modelFromController: i,
-      ...o
-    }
-  ) : null;
+    inverseSolver: r,
+    jointType: n,
+    ...i
+  } = e, o = Ve(() => !r && n === "REVOLUTE_JOINT", [r, n]);
+  return r || o ? /* @__PURE__ */ t.jsx(xe, { ...i }) : /* @__PURE__ */ t.jsx(je, { ...i });
 });
 export {
   rt as C,
@@ -1304,11 +1263,11 @@ export {
   st as T,
   ut as a,
   it as b,
-  we as c,
-  ge as d,
+  je as c,
+  xe as d,
   at as e,
-  U as f,
-  Ke as g,
+  C as f,
+  Je as g,
   ct as h
 };
-//# sourceMappingURL=MotionGroupVisualizer-CrLamHYm.js.map
+//# sourceMappingURL=MotionGroupVisualizer-DzSF9oW7.js.map