@wandelbots/wandelbots-js-react-components 6.1.0 → 6.2.0

package/dist/chunks/{MotionGroupVisualizer-cHohruur.js → MotionGroupVisualizer-CEiRJk_l.js}

@@ -1,28 +1,28 @@
-import { jsx as r, jsxs as x, Fragment as B } from "react/jsx-runtime";
-import * as b from "three";
-import { Matrix4 as v, Vector3 as k, Quaternion as J } from "three";
-import { ConvexGeometry as ce, RoundedBoxGeometry as Te } from "three-stdlib";
-import ke, { useMemo as F, forwardRef as Ge, useRef as R, useImperativeHandle as Le, useEffect as I, useState as G, useCallback as L, Suspense as le } from "react";
-import { d as Ie, v as Pe, o as Ae, e as A } from "./externalizeComponent-EDymnaGR.js";
-import { Environment as De, Lightformer as P, Line as N, useGLTF as Fe, Bounds as z } from "@react-three/drei";
+import { jsx as r, jsxs as w, Fragment as V } from "react/jsx-runtime";
+import * as x from "three";
+import { Matrix4 as M, Vector3 as P, Quaternion as N } from "three";
+import { ConvexGeometry as ue, RoundedBoxGeometry as Pe } from "three-stdlib";
+import ke, { useMemo as D, forwardRef as Le, useRef as v, useImperativeHandle as Ge, useEffect as I, useState as k, useCallback as L, Suspense as fe } from "react";
+import { d as Ie, v as Ae, o as Oe, e as A } from "./externalizeComponent-EDymnaGR.js";
+import { Environment as De, Lightformer as G, Line as H, useGLTF as Fe, Bounds as te } from "@react-three/drei";
 import { useTheme as Ee } from "@mui/material/styles";
-import M from "@mui/material/Box";
-import ee from "@mui/material/Button";
-import Oe from "@mui/material/Card";
-import te from "@mui/material/Divider";
-import ne from "@mui/material/Typography";
-import { useThree as ue, Canvas as re } from "@react-three/fiber";
-import { observer as Ue } from "mobx-react-lite";
+import S from "@mui/material/Box";
+import ne from "@mui/material/Button";
+import Ue from "@mui/material/Card";
+import re from "@mui/material/Divider";
+import oe from "@mui/material/Typography";
+import { useThree as he, Canvas as ie } from "@react-three/fiber";
+import { observer as Ce } from "mobx-react-lite";
 import { useTranslation as je } from "react-i18next";
-import { d as fe, u as H, b as oe } from "./useSmoothedMotionState-CpGsrwj4.js";
-import { Nova as Ce, Manufacturer as S, JointTypeEnum as C } from "@wandelbots/nova-js/v2";
-import { ErrorBoundary as pe } from "react-error-boundary";
-function Be(e) {
+import { c as pe, g as Q, b as se } from "./useSmoothedMotionState-DyDgSVYX.js";
+import { Nova as Be, Manufacturer as _, JointTypeEnum as B } from "@wandelbots/nova-js/v2";
+import { ErrorBoundary as de } from "react-error-boundary";
+function Ve(e) {
   switch (e.shape_type) {
     case "convex_hull":
-      return new ce(
+      return new ue(
         e.vertices.map(
-          (t) => new b.Vector3(
+          (t) => new x.Vector3(
             t[0] / 1e3,
             t[1] / 1e3,
             t[2] / 1e3
@@ -30,60 +30,60 @@ function Be(e) {
         )
       );
     case "box":
-      return new b.BoxGeometry(
+      return new x.BoxGeometry(
         e.size_x / 1e3,
         e.size_y / 1e3,
         e.size_z / 1e3
       );
     case "sphere":
-      return new b.SphereGeometry(e.radius / 1e3);
+      return new x.SphereGeometry(e.radius / 1e3);
     case "capsule":
-      return new b.CapsuleGeometry(
+      return new x.CapsuleGeometry(
         e.radius / 1e3,
         e.cylinder_height / 1e3
       );
     case "cylinder":
-      return new b.CylinderGeometry(
+      return new x.CylinderGeometry(
         e.radius / 1e3,
         e.radius / 1e3,
         e.height / 1e3
       );
     case "rectangle":
-      return new b.BoxGeometry(e.size_x / 1e3, e.size_y / 1e3, 0);
+      return new x.BoxGeometry(e.size_x / 1e3, e.size_y / 1e3, 0);
     default:
-      return console.warn(`${e.shape_type} is not supported`), new b.BufferGeometry();
+      return console.warn(`${e.shape_type} is not supported`), new x.BufferGeometry();
   }
 }
-function Ve({
+function We({
   name: e,
   collider: n,
   children: t
 }) {
-  var f, c;
-  const a = ((f = n.pose) == null ? void 0 : f.position) ?? [0, 0, 0], i = ((c = n.pose) == null ? void 0 : c.orientation) ?? [0, 0, 0];
+  var f, l;
+  const a = ((f = n.pose) == null ? void 0 : f.position) ?? [0, 0, 0], i = ((l = n.pose) == null ? void 0 : l.orientation) ?? [0, 0, 0];
   return n.margin && console.warn(`${e} margin is not supported`), /* @__PURE__ */ r(
     "mesh",
     {
       name: e,
-      position: new b.Vector3(
+      position: new x.Vector3(
         a[0],
         a[1],
         a[2]
       ).divideScalar(1e3),
-      rotation: new b.Euler(i[0], i[1], i[2], "XYZ"),
-      geometry: Be(n.shape),
+      rotation: new x.Euler(i[0], i[1], i[2], "XYZ"),
+      geometry: Ve(n.shape),
       children: t
     }
   );
 }
-function We({
+function $e({
   name: e,
   colliders: n,
   meshChildrenProvider: t,
   ...a
 }) {
   return /* @__PURE__ */ r("group", { name: e, ...a, children: Object.entries(n).map(([i, f]) => /* @__PURE__ */ r(
-    Ve,
+    We,
     {
       name: i,
       collider: f,
@@ -98,21 +98,21 @@ function vt({
 }) {
   const t = e.colliders;
   return /* @__PURE__ */ r("group", { children: t && /* @__PURE__ */ r(
-    We,
+    $e,
     {
       meshChildrenProvider: n,
       colliders: t
     }
   ) });
 }
-function ie() {
-  return /* @__PURE__ */ r(De, { frames: 1, children: /* @__PURE__ */ r(Je, {}) });
+function ae() {
+  return /* @__PURE__ */ r(De, { frames: 1, children: /* @__PURE__ */ r(Ne, {}) });
 }
-const $e = [2, 0, 2, 0, 2, 0, 2, 0];
-function Je({ positions: e = $e }) {
-  return /* @__PURE__ */ x(B, { children: [
+const Je = [2, 0, 2, 0, 2, 0, 2, 0];
+function Ne({ positions: e = Je }) {
+  return /* @__PURE__ */ w(V, { children: [
     /* @__PURE__ */ r(
-      P,
+      G,
       {
         intensity: 5,
         "rotation-x": Math.PI / 2,
@@ -121,7 +121,7 @@ function Je({ positions: e = $e }) {
       }
     ),
     /* @__PURE__ */ r("group", { rotation: [0, 0.5, 0], children: /* @__PURE__ */ r("group", { children: e.map((n, t) => /* @__PURE__ */ r(
-      P,
+      G,
       {
         form: "circle",
         intensity: 5,
@@ -132,7 +132,7 @@ function Je({ positions: e = $e }) {
       t
     )) }) }),
     /* @__PURE__ */ r(
-      P,
+      G,
       {
         intensity: 40,
         "rotation-y": Math.PI / 2,
@@ -141,7 +141,7 @@ function Je({ positions: e = $e }) {
       }
     ),
     /* @__PURE__ */ r(
-      P,
+      G,
       {
         intensity: 20,
         "rotation-y": -Math.PI,
@@ -150,7 +150,7 @@ function Je({ positions: e = $e }) {
       }
     ),
     /* @__PURE__ */ r(
-      P,
+      G,
       {
         "rotation-y": Math.PI / 2,
         position: [-5, -1, -1],
@@ -159,7 +159,7 @@ function Je({ positions: e = $e }) {
       }
     ),
     /* @__PURE__ */ r(
-      P,
+      G,
       {
         "rotation-y": -Math.PI / 2,
         position: [10, 1, 0],
@@ -168,7 +168,7 @@ function Je({ positions: e = $e }) {
       }
     ),
     /* @__PURE__ */ r(
-      P,
+      G,
       {
         form: "ring",
         color: "white",
@@ -180,7 +180,7 @@ function Je({ positions: e = $e }) {
     )
   ] });
 }
-const se = {
+const ce = {
   attach: "material",
   color: "#009f4d",
   opacity: 0.2,
@@ -194,45 +194,45 @@ function Mt({
   dhParameters: n,
   ...t
 }) {
-  const a = F(
+  const a = D(
     () => Ie(n ?? []),
     [n]
-  ), i = (c, o) => {
-    var m, h;
-    if (!((m = o == null ? void 0 : o.pose) != null && m.position) || !((h = o == null ? void 0 : o.pose) != null && h.orientation))
+  ), i = (l, o) => {
+    var y, m;
+    if (!((y = o == null ? void 0 : o.pose) != null && y.position) || !((m = o == null ? void 0 : o.pose) != null && m.orientation))
       return null;
-    const g = new b.Vector3(
+    const p = new x.Vector3(
       o.pose.position[0] / 1e3,
       o.pose.position[1] / 1e3,
       o.pose.position[2] / 1e3
-    ), s = new b.Vector3(
+    ), s = new x.Vector3(
       o.pose.orientation[0],
       o.pose.orientation[1],
       o.pose.orientation[2]
     );
-    let p;
-    const l = o.shape.shape_type === "plane" ? { ...se, side: b.DoubleSide } : { ...se, side: b.FrontSide };
+    let d;
+    const c = o.shape.shape_type === "plane" ? { ...ce, side: x.DoubleSide } : { ...ce, side: x.FrontSide };
     switch (o.shape.shape_type) {
       /**
        * Plane shape, uses DH parameters to calculate the size of the plane (reach distance of a robot)
        */
       case "plane":
-        p = /* @__PURE__ */ r("planeGeometry", { args: [a, a] });
+        d = /* @__PURE__ */ r("planeGeometry", { args: [a, a] });
         break;
       /**
        * Sphere shape
        */
       case "sphere": {
-        const d = (o == null ? void 0 : o.shape).radius / 1e3;
-        p = /* @__PURE__ */ r("sphereGeometry", { args: [d] });
+        const h = (o == null ? void 0 : o.shape).radius / 1e3;
+        d = /* @__PURE__ */ r("sphereGeometry", { args: [h] });
         break;
       }
       /**
        * Capsule shape
        */
       case "capsule": {
-        const d = (o == null ? void 0 : o.shape).radius / 1e3, u = (o == null ? void 0 : o.shape).cylinder_height / 1e3;
-        p = /* @__PURE__ */ r("capsuleGeometry", { args: [d, u] });
+        const h = (o == null ? void 0 : o.shape).radius / 1e3, u = (o == null ? void 0 : o.shape).cylinder_height / 1e3;
+        d = /* @__PURE__ */ r("capsuleGeometry", { args: [h, u] });
         break;
       }
       /**
@@ -240,26 +240,26 @@ function Mt({
        * renderer to be able to visualize the convex hull.
        */
       case "convex_hull": {
-        const d = (o == null ? void 0 : o.shape).vertices.map(
-          (y) => new b.Vector3(y[0] / 1e3, y[1] / 1e3, y[2] / 1e3)
-        ), u = Pe(d);
+        const h = (o == null ? void 0 : o.shape).vertices.map(
+          (b) => new x.Vector3(b[0] / 1e3, b[1] / 1e3, b[2] / 1e3)
+        ), u = Ae(h);
         if (u.isCoplanar && u.normal) {
-          const w = new b.Vector3().addVectors(
-            d[0],
+          const g = new x.Vector3().addVectors(
+            h[0],
             u.normal.multiplyScalar(1e-4)
           );
-          d.push(w);
+          h.push(g);
         }
         try {
-          p = /* @__PURE__ */ r(
+          d = /* @__PURE__ */ r(
             "primitive",
             {
-              object: new ce(d),
+              object: new ue(h),
               attach: "geometry"
             }
           );
-        } catch (y) {
-          return console.log("Error creating ConvexGeometry:", y), null;
+        } catch (b) {
+          return console.log("Error creating ConvexGeometry:", b), null;
         }
         break;
       }
@@ -271,11 +271,11 @@ function Mt({
        * Basically a rounded box with a rectangular cross-section.
        */
       case "rectangular_capsule": {
-        const d = o.shape, u = d.radius / 1e3, y = d.sphere_center_distance_x / 1e3, w = d.sphere_center_distance_y / 1e3, T = u * 2;
-        p = /* @__PURE__ */ r(
+        const h = o.shape, u = h.radius / 1e3, b = h.sphere_center_distance_x / 1e3, g = h.sphere_center_distance_y / 1e3, R = u * 2;
+        d = /* @__PURE__ */ r(
           "primitive",
           {
-            object: new Te(y, w, T, 2, u),
+            object: new Pe(b, g, R, 2, u),
             attach: "geometry"
           }
         );
@@ -285,23 +285,23 @@ function Mt({
         console.warn(
           "Unsupported safety zone shape type:",
           o.shape.shape_type
-        ), p = null;
+        ), d = null;
     }
-    return /* @__PURE__ */ x(
+    return /* @__PURE__ */ w(
       "mesh",
       {
-        renderOrder: c,
-        position: g,
-        quaternion: Ae(s),
+        renderOrder: l,
+        position: p,
+        quaternion: Oe(s),
         children: [
-          p,
-          /* @__PURE__ */ r("meshStandardMaterial", { ...l, polygonOffsetFactor: -c })
+          d,
+          /* @__PURE__ */ r("meshStandardMaterial", { ...c, polygonOffsetFactor: -l })
         ]
       },
-      `safety-zone-${o.shape.shape_type}-${c}`
+      `safety-zone-${o.shape.shape_type}-${l}`
     );
-  }, f = F(() => Object.values(e ?? {}).map(
-    (c, o) => i(o, c)
+  }, f = D(() => Object.values(e ?? {}).map(
+    (l, o) => i(o, l)
   ), [e, a]);
   return /* @__PURE__ */ r("group", { ...t, children: f });
 }
@@ -311,14 +311,14 @@ function St({
 }) {
   const t = (e == null ? void 0 : e.map((a) => {
     if (a.position && a.position.length >= 3) {
-      const [i, f, c] = a.position;
-      if (Number.isFinite(i) && Number.isFinite(f) && Number.isFinite(c))
-        return new b.Vector3(i / 1e3, c / 1e3, -f / 1e3);
+      const [i, f, l] = a.position;
+      if (Number.isFinite(i) && Number.isFinite(f) && Number.isFinite(l))
+        return new x.Vector3(i / 1e3, l / 1e3, -f / 1e3);
     }
     return null;
   }).filter((a) => a !== null)) || [];
   return /* @__PURE__ */ r("group", { ...n, children: t.length > 0 && /* @__PURE__ */ r(
-    N,
+    H,
     {
       points: t,
       lineWidth: 3,
@@ -328,16 +328,16 @@ function St({
     }
   ) });
 }
-const $ = /* @__PURE__ */ new Map();
-async function V(e, n) {
-  if ($.has(e))
-    return $.get(e);
+const J = /* @__PURE__ */ new Map();
+async function W(e, n) {
+  if (J.has(e))
+    return J.get(e);
   const t = (async () => {
-    var c;
-    const a = n || "", i = new Ce({ instanceUrl: a }), f = i.api.motionGroupModels;
-    (c = f.axios) != null && c.interceptors && f.axios.interceptors.request.use((o) => {
-      var g;
-      return (g = o.url) != null && g.includes("/glb") && (o.responseType = "blob"), o;
+    var l;
+    const a = n || "", i = new Be({ instanceUrl: a }), f = i.api.motionGroupModels;
+    (l = f.axios) != null && l.interceptors && f.axios.interceptors.request.use((o) => {
+      var p;
+      return (p = o.url) != null && p.includes("/glb") && (o.responseType = "blob"), o;
     });
     try {
       const o = await i.api.motionGroupModels.getMotionGroupGlbModel(
@@ -348,31 +348,31 @@ async function V(e, n) {
       throw console.error("Failed to fetch model:", o), o;
     }
   })();
-  return $.set(e, t), t;
+  return J.set(e, t), t;
 }
-function de(e) {
+function me(e) {
   function n(t) {
     return t.children.length === 0 ? [t] : [t, ...t.children.flatMap((a) => n(a))];
   }
-  return n(e).filter((t) => me(t));
+  return n(e).filter((t) => ye(t));
 }
-function he(e) {
+function ge(e) {
   return e.name.endsWith("_FLG");
 }
-function me(e) {
+function ye(e) {
   return /_J[0-9]+$/.test(e.name);
 }
-function Ne(e, n) {
+function He(e, n) {
   let t;
   function a(i) {
-    if (he(i)) {
+    if (ge(i)) {
       if (t)
         throw Error(
           `Found multiple flange groups in robot model ${n}; first ${t.name} then ${i.name}. Only one _FLG group is allowed.`
         );
       t = i;
     }
-    me(i), i.children.map(a);
+    ye(i), i.children.map(a);
   }
   if (a(e.scene), !t)
     throw Error(
@@ -380,128 +380,143 @@ function Ne(e, n) {
     );
   return { gltf: e };
 }
-const ye = Ge(
-  function({ rapidlyChangingMotionState: n, dhParameters: t, onRotationChanged: a, children: i }, f) {
-    const c = R(null), o = R([]), g = R(
+const be = Le(
+  function({
+    rapidlyChangingMotionState: n,
+    dhParameters: t,
+    chainOffsetPosition: a,
+    chainOffsetQuaternion: i,
+    onRotationChanged: f,
+    children: l
+  }, o) {
+    const p = v(null), s = v([]), d = v(
       n.joint_position.filter(
-        (u) => u !== void 0
+        (g) => g !== void 0
       )
-    ), { invalidate: s } = ue(), p = R(n);
-    p.current = n;
-    function l(u) {
-      c.current = u, u && m();
+    ), { invalidate: c } = he(), y = v(n);
+    y.current = n;
+    function m(g) {
+      p.current = g, g && h();
     }
-    function m() {
-      c.current && (o.current = de(c.current), h(), s());
-    }
-    Le(f, () => ({ recollectJoints: m }));
     function h() {
-      const u = g.current;
-      if (a)
-        a(o.current, u);
+      p.current && (s.current = me(p.current), u(), c());
+    }
+    Ge(o, () => ({ recollectJoints: h }));
+    function u() {
+      const g = d.current;
+      if (f)
+        f(s.current, g);
       else
-        for (const [y, w] of o.current.entries()) {
-          const T = t[y], D = T.theta || 0, W = T.reverse_rotation_direction ? -1 : 1;
-          w.rotation.y = W * (u[y] || 0) + D;
+        for (const [R, O] of s.current.entries()) {
+          const F = t[R], q = F.theta || 0, $ = F.reverse_rotation_direction ? -1 : 1;
+          O.rotation.y = $ * (g[R] || 0) + q;
         }
     }
-    function d(u) {
-      g.current = u.joint_position.filter(
-        (y) => y !== void 0
-      ), h(), s();
+    function b(g) {
+      d.current = g.joint_position.filter(
+        (R) => R !== void 0
+      ), u(), c();
     }
-    return fe(() => {
-      d(p.current);
+    return pe(() => {
+      b(y.current);
     }), I(() => {
-      d(n);
-    }, [n]), /* @__PURE__ */ r("group", { ref: l, children: i });
+      b(n);
+    }, [n]), /* @__PURE__ */ r(
+      "group",
+      {
+        ref: m,
+        position: a,
+        quaternion: i,
+        children: l
+      }
+    );
   }
-), He = "line", Ye = "mesh";
-function qe({
+), Qe = "line", qe = "mesh";
+function Ye({
   rapidlyChangingMotionState: e,
   dhParameters: n,
   ...t
 }) {
-  const a = new v(), i = R([]), f = R([]);
+  const a = new M(), i = v([]), f = v([]);
   ke.useEffect(() => {
     i.current = new Array(n.length).fill(null), f.current = new Array(n.length).fill(null);
   }, [n.length]);
-  function c(s, p) {
-    const l = new k(), m = new J(), h = new k();
-    a.decompose(l, m, h);
-    const d = l.clone(), u = new v().makeRotationY(
-      s.theta + p * (s.reverse_rotation_direction ? -1 : 1)
-    ).multiply(new v().makeTranslation(0, s.d / 1e3, 0)).multiply(new v().makeTranslation(s.a / 1e3, 0, 0)).multiply(new v().makeRotationX(s.alpha));
-    return a.multiply(u), a.decompose(l, m, h), { a: d, b: l };
+  function l(s, d) {
+    const c = new P(), y = new N(), m = new P();
+    a.decompose(c, y, m);
+    const h = c.clone(), u = new M().makeRotationY(
+      s.theta + d * (s.reverse_rotation_direction ? -1 : 1)
+    ).multiply(new M().makeTranslation(0, s.d / 1e3, 0)).multiply(new M().makeTranslation(s.a / 1e3, 0, 0)).multiply(new M().makeRotationX(s.alpha));
+    return a.multiply(u), a.decompose(c, y, m), { a: h, b: c };
   }
-  function o(s, p, l, m) {
+  function o(s, d, c, y) {
     if (!n)
       return;
-    const h = n[s];
-    if (!h)
+    const m = n[s];
+    if (!m)
       return;
-    const { a: d, b: u } = c(h, m);
-    p.geometry.setPositions([d.toArray(), u.toArray()].flat()), l.position.set(u.x, u.y, u.z);
+    const { a: h, b: u } = l(m, y);
+    d.geometry.setPositions([h.toArray(), u.toArray()].flat()), c.position.set(u.x, u.y, u.z);
   }
-  function g(s, p) {
+  function p(s, d) {
     a.identity();
-    for (let l = 0; l < Math.min(s.length, p.length); l++) {
-      const m = i.current[l], h = f.current[l];
-      m && h && o(l, m, h, p[l]);
+    for (let c = 0; c < Math.min(s.length, d.length); c++) {
+      const y = i.current[c], m = f.current[c];
+      y && m && o(c, y, m, d[c]);
     }
   }
   return /* @__PURE__ */ r(
-    ye,
+    be,
     {
       rapidlyChangingMotionState: e,
       dhParameters: n,
-      onRotationChanged: g,
-      children: /* @__PURE__ */ x("group", { ...t, name: "Scene", children: [
-        /* @__PURE__ */ x("mesh", { children: [
+      onRotationChanged: p,
+      children: /* @__PURE__ */ w("group", { ...t, name: "Scene", children: [
+        /* @__PURE__ */ w("mesh", { children: [
           /* @__PURE__ */ r("sphereGeometry", { args: [0.01, 32, 32] }),
           /* @__PURE__ */ r("meshStandardMaterial", { color: "black", depthTest: !0 })
         ] }),
-        n == null ? void 0 : n.map((s, p) => {
-          const { a: l, b: m } = c(
+        n == null ? void 0 : n.map((s, d) => {
+          const { a: c, b: y } = l(
             s,
-            e.joint_position[p] ?? 0
-          ), h = `dhrobot_J0${p}`;
-          return /* @__PURE__ */ x("group", { name: h, children: [
+            e.joint_position[d] ?? 0
+          ), m = `dhrobot_J0${d}`;
+          return /* @__PURE__ */ w("group", { name: m, children: [
             /* @__PURE__ */ r(
-              N,
+              H,
               {
-                ref: (d) => {
-                  i.current[p] = d;
+                ref: (h) => {
+                  i.current[d] = h;
                 },
-                name: He,
-                points: [l, m],
+                name: Qe,
+                points: [c, y],
                 color: "white",
                 lineWidth: 5
               }
             ),
-            /* @__PURE__ */ x(
+            /* @__PURE__ */ w(
               "mesh",
               {
-                ref: (d) => {
-                  f.current[p] = d;
+                ref: (h) => {
+                  f.current[d] = h;
                 },
-                name: Ye,
-                position: m,
+                name: qe,
+                position: y,
                 children: [
                   /* @__PURE__ */ r("sphereGeometry", { args: [0.01, 32, 32] }),
                   /* @__PURE__ */ r("meshStandardMaterial", { color: "black", depthTest: !0 })
                 ]
               },
-              `mesh_${p}`
+              `mesh_${d}`
             )
-          ] }, h);
+          ] }, m);
         })
       ] })
     }
   );
 }
 const Xe = console.warn;
-function ge() {
+function xe() {
   return I(() => {
     console.warn = (e) => {
       e !== "Cannot call the manual advancement of rafz whilst frameLoop is not set as demand" && Xe(e);
@@ -517,13 +532,13 @@ function Ze({
   postModelRender: t,
   ...a
 }) {
-  const i = Fe(e), c = Ne(i, "robot.glb").gltf, o = L(
+  const i = Fe(e), l = He(i, "robot.glb").gltf, o = L(
     (s) => {
       s && t && t();
     },
     [t]
   );
-  function g(s) {
+  function p(s) {
     try {
       return Ke(s) ? s.geometry ? /* @__PURE__ */ r(
         "mesh",
@@ -549,35 +564,35 @@ function Ze({
           name: s.name,
           position: s.position,
           rotation: s.rotation,
-          ref: he(s) ? n : void 0,
-          children: s.children.map(g)
+          ref: ge(s) ? n : void 0,
+          children: s.children.map(p)
         },
         s.uuid
       );
-    } catch (p) {
-      return console.warn("Error rendering node", s.name, p), null;
+    } catch (d) {
+      return console.warn("Error rendering node", s.name, d), null;
     }
   }
-  return /* @__PURE__ */ r("group", { ...a, dispose: null, ref: o, children: g(c.scene) });
+  return /* @__PURE__ */ r("group", { ...a, dispose: null, ref: o, children: p(l.scene) });
 }
-function be({
+function we({
   modelURL: e,
   flangeRef: n,
   postModelRender: t,
   ...a
 }) {
-  const [i, f] = G(null);
+  const [i, f] = k(null);
   return I(() => {
-    let c = !1;
+    let l = !1;
     return (async () => {
       try {
-        const g = typeof e == "string" ? e : await e;
-        c || f((s) => s === g ? s : g);
-      } catch (g) {
-        console.error("Failed to resolve model URL:", g);
+        const p = typeof e == "string" ? e : await e;
+        l || f((s) => s === p ? s : p);
+      } catch (p) {
+        console.error("Failed to resolve model URL:", p);
       }
     })(), () => {
-      c = !0;
+      l = !0;
     };
   }, [e]), i ? /* @__PURE__ */ r(
     Ze,
@@ -589,19 +604,19 @@ function be({
     }
   ) : null;
 }
-const xe = (e, n) => {
+const Re = (e, n) => {
   e.userData.isGhost || (e.traverse((t) => {
-    if (t instanceof b.Mesh) {
-      t.material instanceof b.Material && (t.material.colorWrite = !1);
+    if (t instanceof x.Mesh) {
+      t.material instanceof x.Material && (t.material.colorWrite = !1);
       const a = t.clone(), i = t.clone();
-      a.material = new b.MeshStandardMaterial({
+      a.material = new x.MeshStandardMaterial({
         depthTest: !0,
         depthWrite: !0,
         colorWrite: !1,
         polygonOffset: !0,
         polygonOffsetFactor: -1,
-        side: b.DoubleSide
-      }), a.userData.isGhost = !0, i.material = new b.MeshStandardMaterial({
+        side: x.DoubleSide
+      }), a.userData.isGhost = !0, i.material = new x.MeshStandardMaterial({
         color: n,
         opacity: 0.3,
         depthTest: !0,
@@ -609,92 +624,96 @@ const xe = (e, n) => {
         transparent: !0,
         polygonOffset: !0,
         polygonOffsetFactor: -2,
-        side: b.DoubleSide
+        side: x.DoubleSide
       }), i.userData.isGhost = !0, t.parent && (t.parent.add(a), t.parent.add(i));
     }
   }), e.userData.isGhost = !0);
-}, we = (e) => {
+}, ve = (e) => {
   if (!e.userData.isGhost) return;
   const n = [];
   e.traverse((t) => {
     var a;
-    t instanceof b.Mesh && ((a = t.userData) != null && a.isGhost ? n.push(t) : t.material instanceof b.Material && (t.material.colorWrite = !0));
+    t instanceof x.Mesh && ((a = t.userData) != null && a.isGhost ? n.push(t) : t.material instanceof x.Material && (t.material.colorWrite = !0));
   }), n.forEach((t) => {
     t.parent && t.parent.remove(t);
   }), e.userData.isGhost = !1;
-}, Re = A(
+}, Me = A(
   ({
     rapidlyChangingMotionState: e,
     modelFromController: n,
     dhParameters: t,
-    getModel: a = V,
-    flangeRef: i,
-    postModelRender: f,
-    transparentColor: c,
-    instanceUrl: o,
-    ...g
+    chainOffsetPosition: a,
+    chainOffsetQuaternion: i,
+    getModel: f = W,
+    flangeRef: l,
+    postModelRender: o,
+    transparentColor: p,
+    instanceUrl: s,
+    ...d
   }) => {
-    const [s, p] = G(null), l = R(null), m = L((y) => {
-      p(y);
-    }, []), h = L(() => {
-      var y;
-      (y = l.current) == null || y.recollectJoints(), f == null || f();
-    }, [f]);
+    const [c, y] = k(null), m = v(null), h = L((R) => {
+      y(R);
+    }, []), u = L(() => {
+      var R;
+      (R = m.current) == null || R.recollectJoints(), o == null || o();
+    }, [o]);
     I(() => {
-      s && (c ? xe(s, c) : we(s));
-    }, [s, c]);
-    const d = F(() => {
-      const y = a(n, o);
-      if (!y)
+      c && (p ? Re(c, p) : ve(c));
+    }, [c, p]);
+    const b = D(() => {
+      const R = f(n, s);
+      if (!R)
         throw new Error(
           `No model found for robot "${n}". Ensure the model is available or provide a custom getModel function.`
         );
-      return y;
-    }, [n, o, a]), u = /* @__PURE__ */ r(
-      qe,
+      return R;
+    }, [n, s, f]), g = /* @__PURE__ */ r(
+      Ye,
       {
         rapidlyChangingMotionState: e,
         dhParameters: t,
-        ...g
+        ...d
       }
     );
-    return /* @__PURE__ */ x(
-      pe,
+    return /* @__PURE__ */ w(
+      de,
       {
-        fallback: u,
-        onError: (y) => {
-          console.warn(y);
+        fallback: g,
+        onError: (R) => {
+          console.warn(R);
         },
         children: [
-          /* @__PURE__ */ r(le, { fallback: u, children: /* @__PURE__ */ r("group", { ref: m, children: /* @__PURE__ */ r(
-            ye,
+          /* @__PURE__ */ r(fe, { fallback: g, children: /* @__PURE__ */ r("group", { ref: h, children: /* @__PURE__ */ r(
+            be,
             {
-              ref: l,
+              ref: m,
               rapidlyChangingMotionState: e,
               dhParameters: t,
+              chainOffsetPosition: a,
+              chainOffsetQuaternion: i,
               children: /* @__PURE__ */ r(
-                be,
+                we,
                 {
-                  modelURL: d,
-                  postModelRender: h,
-                  flangeRef: i,
-                  ...g
+                  modelURL: b,
+                  postModelRender: u,
+                  flangeRef: l,
+                  ...d
                 }
               )
             }
           ) }) }),
-          /* @__PURE__ */ r(ge, {})
+          /* @__PURE__ */ r(xe, {})
         ]
       }
     );
   }
-), Qe = A(
+), ze = A(
   ({ rapidlyChangingMotionState: e, ...n }) => {
-    const t = H(
+    const t = Q(
       e
     );
     return /* @__PURE__ */ r(
-      Re,
+      Me,
       {
         rapidlyChangingMotionState: t,
         ...n
@@ -702,16 +721,19 @@ const xe = (e, n) => {
     );
   }
 );
-function ze({
+function et({
   connectedMotionGroup: e,
-  getModel: n = V,
+  getModel: n = W,
   flangeRef: t,
   transparentColor: a,
   postModelRender: i,
   ...f
 }) {
-  return e.dhParameters ? /* @__PURE__ */ r(
-    Qe,
+  if (!e.dhParameters)
+    return null;
+  const l = e.mountingPosition, o = e.mountingQuaternion;
+  return /* @__PURE__ */ r(
+    ze,
     {
       rapidlyChangingMotionState: e.rapidlyChangingMotionState,
       modelFromController: e.modelFromController || "",
@@ -720,12 +742,14 @@ function ze({
       flangeRef: t,
       transparentColor: a,
       postModelRender: i,
+      chainOffsetPosition: l,
+      chainOffsetQuaternion: o,
       ...f
     }
-  ) : null;
+  );
 }
 const _t = A(
-  Ue(
+  Ce(
     ({
       robotName: e,
       programState: n,
@@ -733,61 +757,61 @@ const _t = A(
       operationMode: a,
       driveToHomeEnabled: i = !1,
       onDriveToHomePress: f,
-      onDriveToHomeRelease: c,
+      onDriveToHomeRelease: l,
       connectedMotionGroup: o,
-      robotComponent: g = ze,
+      robotComponent: p = et,
       customContentComponent: s,
-      className: p
+      className: d
     }) => {
-      var X;
-      const l = Ee(), { t: m } = je(), [h, d] = G(!1), u = R(null), y = R(null), [w, T] = G(!1), [D, W] = G({ width: 400, height: 600 }), [rt, _e] = G(0);
+      var K;
+      const c = Ee(), { t: y } = je(), [m, h] = k(!1), u = v(null), b = v(null), [g, R] = k(!1), [O, F] = k({ width: 400, height: 600 }), [q, $] = k(0);
       I(() => {
         const j = () => {
-          if (y.current) {
-            const { offsetWidth: Z, offsetHeight: Q } = y.current;
-            T(Z > Q), W({ width: Z, height: Q });
+          if (b.current) {
+            const { offsetWidth: z, offsetHeight: ee } = b.current;
+            R(z > ee), F({ width: z, height: ee });
           }
         };
         j();
-        const K = new ResizeObserver(j);
-        return y.current && K.observe(y.current), () => {
-          K.disconnect();
+        const Z = new ResizeObserver(j);
+        return b.current && Z.observe(b.current), () => {
+          Z.disconnect();
         };
       }, []);
       const Y = L(() => {
-        _e((j) => j + 1);
+        $((j) => j + 1);
       }, []), E = L(() => {
-        !i || !f || (d(!0), f());
-      }, [i, f]), O = L(() => {
-        !i || !c || (d(!1), c());
-      }, [i, c]), q = L(() => {
-        h && c && (d(!1), c());
-      }, [h, c]), _ = w ? D.width < 350 : D.height < 200, U = w ? D.height < 310 : D.height < 450;
+        !i || !f || (h(!0), f());
+      }, [i, f]), U = L(() => {
+        !i || !l || (h(!1), l());
+      }, [i, l]), X = L(() => {
+        m && l && (h(!1), l());
+      }, [m, l]), T = g ? O.width < 350 : O.height < 200, C = g ? O.height < 310 : O.height < 450;
       return /* @__PURE__ */ r(
-        Oe,
+        Ue,
         {
-          ref: y,
-          className: p,
+          ref: b,
+          className: d,
           sx: {
             width: "100%",
             height: "100%",
             display: "flex",
-            flexDirection: w ? "row" : "column",
+            flexDirection: g ? "row" : "column",
             position: "relative",
             overflow: "hidden",
             minWidth: { xs: 180, sm: 220, md: 250 },
-            minHeight: w ? { xs: 200, sm: 240, md: 260 } : { xs: 150, sm: 180, md: 220 },
+            minHeight: g ? { xs: 200, sm: 240, md: 260 } : { xs: 150, sm: 180, md: 220 },
             // Allow progressive hiding in portrait mode
-            border: `1px solid ${l.palette.divider}`,
+            border: `1px solid ${c.palette.divider}`,
             borderRadius: "18px",
             boxShadow: "none",
-            backgroundColor: ((X = l.palette.backgroundPaperElevation) == null ? void 0 : X[8]) || "#292B3F",
+            backgroundColor: ((K = c.palette.backgroundPaperElevation) == null ? void 0 : K[8]) || "#292B3F",
             backgroundImage: "none"
             // Override any gradient from elevation
           },
-          children: w ? /* @__PURE__ */ x(B, { children: [
+          children: g ? /* @__PURE__ */ w(V, { children: [
             /* @__PURE__ */ r(
-              M,
+              S,
               {
                 sx: {
                   flex: "0 0 50%",
@@ -800,10 +824,10 @@ const _t = A(
                   mr: { xs: 0.75, sm: 1, md: 1.5 },
                   overflow: "hidden",
                   // Prevent content from affecting container size
-                  display: _ ? "none" : "block"
+                  display: T ? "none" : "block"
                 },
-                children: !_ && /* @__PURE__ */ x(
-                  re,
+                children: !T && /* @__PURE__ */ w(
+                  ie,
                   {
                     orthographic: !0,
                     camera: {
@@ -813,7 +837,7 @@ const _t = A(
                     shadows: !0,
                     frameloop: "demand",
                     style: {
-                      borderRadius: l.shape.borderRadius,
+                      borderRadius: c.shape.borderRadius,
                       width: "100%",
                       height: "100%",
                       background: "transparent",
@@ -824,9 +848,9 @@ const _t = A(
                     dpr: [1, 2],
                     gl: { alpha: !0, antialias: !0 },
                     children: [
-                      /* @__PURE__ */ r(ie, {}),
-                      /* @__PURE__ */ r(z, { fit: !0, observe: !0, margin: 1, maxDuration: 1, children: /* @__PURE__ */ r(
-                        g,
+                      /* @__PURE__ */ r(ae, {}),
+                      /* @__PURE__ */ r(te, { fit: !0, observe: !0, margin: 1, maxDuration: 1, children: /* @__PURE__ */ r(
+                        p,
                         {
                           connectedMotionGroup: o,
                           postModelRender: Y
@@ -837,19 +861,19 @@ const _t = A(
                 )
               }
             ),
-            /* @__PURE__ */ x(
-              M,
+            /* @__PURE__ */ w(
+              S,
               {
                 sx: {
                   flex: "1",
                   display: "flex",
                   flexDirection: "column",
                   justifyContent: "flex-start",
-                  width: _ ? "100%" : "50%"
+                  width: T ? "100%" : "50%"
                 },
                 children: [
-                  /* @__PURE__ */ x(
-                    M,
+                  /* @__PURE__ */ w(
+                    S,
                     {
                       sx: {
                         p: { xs: 1.5, sm: 2, md: 3 },
@@ -857,9 +881,9 @@ const _t = A(
                         textAlign: "left"
                       },
                       children: [
-                        /* @__PURE__ */ r(ne, { variant: "h6", component: "h2", sx: { mb: 1 }, children: e }),
+                        /* @__PURE__ */ r(oe, { variant: "h6", component: "h2", sx: { mb: 1 }, children: e }),
                         /* @__PURE__ */ r(
-                          oe,
+                          se,
                           {
                             programState: n,
                             safetyState: t,
@@ -869,8 +893,8 @@ const _t = A(
                       ]
                     }
                   ),
-                  /* @__PURE__ */ x(
-                    M,
+                  /* @__PURE__ */ w(
+                    S,
                     {
                       sx: {
                         p: { xs: 1.5, sm: 2, md: 3 },
@@ -881,28 +905,28 @@ const _t = A(
                         justifyContent: "space-between"
                       },
                       children: [
-                        !U && s && /* @__PURE__ */ x(M, { children: [
+                        !C && s && /* @__PURE__ */ w(S, { children: [
                           /* @__PURE__ */ r(s, {}),
                           /* @__PURE__ */ r(
-                            te,
+                            re,
                             {
                               sx: {
                                 mt: 1,
                                 mb: 0,
-                                borderColor: l.palette.divider,
+                                borderColor: c.palette.divider,
                                 opacity: 0.5
                               }
                             }
                           )
                         ] }),
                         /* @__PURE__ */ r(
-                          M,
+                          S,
                           {
                             sx: {
-                              mt: !U && s ? "auto" : 0
+                              mt: !C && s ? "auto" : 0
                             },
                             children: /* @__PURE__ */ r(
-                              M,
+                              S,
                               {
                                 sx: {
                                   display: "flex",
@@ -911,7 +935,7 @@ const _t = A(
                                   mb: { xs: 0.5, sm: 0.75, md: 1 }
                                 },
                                 children: /* @__PURE__ */ r(
-                                  ee,
+                                  ne,
                                   {
                                     ref: u,
                                     variant: "contained",
@@ -919,16 +943,16 @@ const _t = A(
                                     size: "small",
                                     disabled: !i,
                                     onMouseDown: E,
-                                    onMouseUp: O,
-                                    onMouseLeave: q,
+                                    onMouseUp: U,
+                                    onMouseLeave: X,
                                     onTouchStart: E,
-                                    onTouchEnd: O,
+                                    onTouchEnd: U,
                                     sx: {
                                       textTransform: "none",
                                       px: 1.5,
                                       py: 0.5
                                     },
-                                    children: m("RobotCard.DriveToHome.bt")
+                                    children: y("RobotCard.DriveToHome.bt")
                                   }
                                 )
                               }
@@ -941,8 +965,8 @@ const _t = A(
                 ]
               }
             )
-          ] }) : /* @__PURE__ */ r(B, { children: /* @__PURE__ */ x(
-            M,
+          ] }) : /* @__PURE__ */ r(V, { children: /* @__PURE__ */ w(
+            S,
             {
               sx: {
                 p: 3,
@@ -951,10 +975,10 @@ const _t = A(
                 flexDirection: "column"
               },
               children: [
-                /* @__PURE__ */ x(M, { children: [
-                  /* @__PURE__ */ r(ne, { variant: "h6", component: "h2", sx: { mb: 1 }, children: e }),
+                /* @__PURE__ */ w(S, { children: [
+                  /* @__PURE__ */ r(oe, { variant: "h6", component: "h2", sx: { mb: 1 }, children: e }),
                   /* @__PURE__ */ r(
-                    oe,
+                    se,
                     {
                       programState: n,
                       safetyState: t,
@@ -963,19 +987,19 @@ const _t = A(
                   )
                 ] }),
                 /* @__PURE__ */ r(
-                  M,
+                  S,
                   {
                     sx: {
-                      flex: _ ? 0 : 1,
+                      flex: T ? 0 : 1,
                       position: "relative",
-                      minHeight: _ ? 0 : { xs: 120, sm: 150, md: 200 },
-                      height: _ ? 0 : "auto",
+                      minHeight: T ? 0 : { xs: 120, sm: 150, md: 200 },
+                      height: T ? 0 : "auto",
                       borderRadius: 1,
                       overflow: "hidden",
-                      display: _ ? "none" : "block"
+                      display: T ? "none" : "block"
                     },
-                    children: !_ && /* @__PURE__ */ x(
-                      re,
+                    children: !T && /* @__PURE__ */ w(
+                      ie,
                       {
                         orthographic: !0,
                         camera: {
@@ -985,7 +1009,7 @@ const _t = A(
                         shadows: !0,
                         frameloop: "demand",
                         style: {
-                          borderRadius: l.shape.borderRadius,
+                          borderRadius: c.shape.borderRadius,
                           width: "100%",
                           height: "100%",
                           background: "transparent",
@@ -994,9 +1018,9 @@ const _t = A(
                         dpr: [1, 2],
                         gl: { alpha: !0, antialias: !0 },
                         children: [
-                          /* @__PURE__ */ r(ie, {}),
-                          /* @__PURE__ */ r(z, { fit: !0, clip: !0, observe: !0, margin: 1, maxDuration: 1, children: /* @__PURE__ */ r(
-                            g,
+                          /* @__PURE__ */ r(ae, {}),
+                          /* @__PURE__ */ r(te, { fit: !0, clip: !0, observe: !0, margin: 1, maxDuration: 1, children: /* @__PURE__ */ r(
+                            p,
                             {
                               connectedMotionGroup: o,
                               postModelRender: Y
@@ -1007,32 +1031,32 @@ const _t = A(
                     )
                   }
                 ),
-                /* @__PURE__ */ x(M, { children: [
-                  !U && s && /* @__PURE__ */ x(B, { children: [
+                /* @__PURE__ */ w(S, { children: [
+                  !C && s && /* @__PURE__ */ w(V, { children: [
                     /* @__PURE__ */ r(s, {}),
                     /* @__PURE__ */ r(
-                      te,
+                      re,
                       {
                         sx: {
                           mt: 1,
                           mb: 0,
-                          borderColor: l.palette.divider,
+                          borderColor: c.palette.divider,
                           opacity: 0.5
                         }
                       }
                     )
                   ] }),
                   /* @__PURE__ */ r(
-                    M,
+                    S,
                     {
                       sx: {
                         display: "flex",
                         justifyContent: "flex-start",
-                        mt: !U && s ? { xs: 1, sm: 2, md: 5 } : { xs: 0.5, sm: 1, md: 2 },
+                        mt: !C && s ? { xs: 1, sm: 2, md: 5 } : { xs: 0.5, sm: 1, md: 2 },
                         mb: { xs: 0.5, sm: 0.75, md: 1 }
                       },
                       children: /* @__PURE__ */ r(
-                        ee,
+                        ne,
                         {
                           ref: u,
                           variant: "contained",
@@ -1040,16 +1064,16 @@ const _t = A(
                           size: "small",
                           disabled: !i,
                           onMouseDown: E,
-                          onMouseUp: O,
-                          onMouseLeave: q,
+                          onMouseUp: U,
+                          onMouseLeave: X,
                           onTouchStart: E,
-                          onTouchEnd: O,
+                          onTouchEnd: U,
                           sx: {
                             textTransform: "none",
                             px: 1.5,
                             py: 0.5
                           },
-                          children: m("RobotCard.DriveToHome.bt")
+                          children: y("RobotCard.DriveToHome.bt")
                         }
                       )
                     }
@@ -1063,117 +1087,125 @@ const _t = A(
     }
   )
 ), Tt = Array(6).fill(2 * Math.PI);
-function ve({
+function Se({
   rapidlyChangingMotionState: e,
   dhParameters: n,
-  onTranslationChanged: t,
-  children: a
+  chainOffsetPosition: t,
+  chainOffsetQuaternion: a,
+  onTranslationChanged: i,
+  children: f
 }) {
-  const i = R([]), f = R(
+  const l = v([]), o = v(
     e.joint_position.filter(
-      (l) => l !== void 0
+      (m) => m !== void 0
     )
-  ), { invalidate: c } = ue(), o = R(e);
-  o.current = e;
-  function g(l) {
-    l && (i.current = de(l), s(), c());
+  ), { invalidate: p } = he(), s = v(e);
+  s.current = e;
+  function d(m) {
+    m && (l.current = me(m), c(), p());
   }
-  function s() {
-    const l = f.current;
-    if (t)
-      t(i.current, l);
+  function c() {
+    const m = o.current;
+    if (i)
+      i(l.current, m);
     else
-      for (const [m, h] of i.current.entries()) {
-        const u = n[m].reverse_rotation_direction ? -1 : 1;
-        h.position.y = u * (l[m] || 0) / 1e3;
+      for (const [h, u] of l.current.entries()) {
+        const g = n[h].reverse_rotation_direction ? -1 : 1;
+        u.position.y = g * (m[h] || 0) / 1e3;
       }
   }
-  function p(l) {
-    f.current = l.joint_position.filter(
-      (m) => m !== void 0
-    ), s(), c();
+  function y(m) {
+    o.current = m.joint_position.filter(
+      (h) => h !== void 0
+    ), c(), p();
   }
-  return fe(() => {
-    p(o.current);
-  }), I(() => {
-    p(e);
-  }, [e]), /* @__PURE__ */ r("group", { ref: g, children: a });
+  return pe(() => {
+    y(s.current);
+  }), /* @__PURE__ */ r(
+    "group",
+    {
+      ref: d,
+      position: t,
+      quaternion: a,
+      children: f
+    }
+  );
 }
-function Me({
+function _e({
   rapidlyChangingMotionState: e,
   dhParameters: n,
   ...t
 }) {
-  const a = new v(), i = R(null), f = R(null);
-  function c(s) {
-    const p = new v();
-    for (let d = 0; d < n.length; d++) {
-      const u = n[d], y = s[d] ?? 0, w = new v().makeRotationY(u.theta).multiply(
-        new v().makeTranslation(
+  const a = new M(), i = v(null), f = v(null);
+  function l(s) {
+    const d = new M();
+    for (let h = 0; h < n.length; h++) {
+      const u = n[h], b = s[h] ?? 0, g = new M().makeRotationY(u.theta).multiply(
+        new M().makeTranslation(
           u.a / 1e3,
-          (u.d + y * (u.reverse_rotation_direction ? -1 : 1)) / 1e3,
+          (u.d + b * (u.reverse_rotation_direction ? -1 : 1)) / 1e3,
           0
         )
-      ).multiply(new v().makeRotationX(u.alpha));
-      p.multiply(w);
+      ).multiply(new M().makeRotationX(u.alpha));
+      d.multiply(g);
     }
-    const l = new k(), m = new J(), h = new k();
-    return p.decompose(l, m, h), l;
+    const c = new P(), y = new N(), m = new P();
+    return d.decompose(c, y, m), c;
   }
-  const o = c(
+  const o = l(
     e.joint_position
   );
-  function g(s, p) {
+  function p(s, d) {
     a.identity();
-    let l = new k();
+    let c = new P();
     for (let u = 0; u < n.length; u++) {
-      const y = p[u] ?? 0, w = n[u], T = new v().makeRotationY(w.theta).multiply(
-        new v().makeTranslation(
-          w.a / 1e3,
-          (w.d + y * (w.reverse_rotation_direction ? -1 : 1)) / 1e3,
+      const b = d[u] ?? 0, g = n[u], R = new M().makeRotationY(g.theta).multiply(
+        new M().makeTranslation(
+          g.a / 1e3,
+          (g.d + b * (g.reverse_rotation_direction ? -1 : 1)) / 1e3,
           0
         )
-      ).multiply(new v().makeRotationX(w.alpha));
-      a.multiply(T);
+      ).multiply(new M().makeRotationX(g.alpha));
+      a.multiply(R);
     }
-    const m = new k(), h = new J(), d = new k();
-    if (a.decompose(m, h, d), l = m, i.current && i.current.position.set(
-      l.x,
-      l.y,
-      l.z
+    const y = new P(), m = new N(), h = new P();
+    if (a.decompose(y, m, h), c = y, i.current && i.current.position.set(
+      c.x,
+      c.y,
+      c.z
     ), f.current) {
       const u = f.current.geometry;
       u != null && u.setPositions && u.setPositions([
         0,
         0,
         0,
-        l.x,
-        l.y,
-        l.z
+        c.x,
+        c.y,
+        c.z
       ]);
     }
   }
   return /* @__PURE__ */ r(
-    ve,
+    Se,
     {
       rapidlyChangingMotionState: e,
       dhParameters: n,
-      onTranslationChanged: g,
-      children: /* @__PURE__ */ x("group", { ...t, name: "Scene", children: [
-        /* @__PURE__ */ x("mesh", { name: "Base", position: [0, 0, 0], children: [
+      onTranslationChanged: p,
+      children: /* @__PURE__ */ w("group", { ...t, name: "Scene", children: [
+        /* @__PURE__ */ w("mesh", { name: "Base", position: [0, 0, 0], children: [
           /* @__PURE__ */ r("sphereGeometry", { args: [0.02, 32, 32] }),
           /* @__PURE__ */ r("meshStandardMaterial", { color: "green", depthTest: !0 })
         ] }),
         /* @__PURE__ */ r(
-          N,
+          H,
           {
             ref: f,
-            points: [new k(0, 0, 0), o],
+            points: [new P(0, 0, 0), o],
             color: "White",
             lineWidth: 5
           }
         ),
-        /* @__PURE__ */ x("mesh", { ref: i, name: "TCP", position: o, children: [
+        /* @__PURE__ */ w("mesh", { ref: i, name: "TCP", position: o, children: [
           /* @__PURE__ */ r("sphereGeometry", { args: [0.025, 32, 32] }),
           /* @__PURE__ */ r("meshStandardMaterial", { color: "red", depthTest: !0 })
         ] })
@@ -1181,79 +1213,83 @@ function Me({
     }
   );
 }
-const Se = A(
+const Te = A(
   ({
     rapidlyChangingMotionState: e,
     modelFromController: n,
     dhParameters: t,
-    getModel: a = V,
-    flangeRef: i,
-    postModelRender: f,
-    transparentColor: c,
-    instanceUrl: o,
-    ...g
+    chainOffsetPosition: a,
+    chainOffsetQuaternion: i,
+    getModel: f = W,
+    flangeRef: l,
+    postModelRender: o,
+    transparentColor: p,
+    instanceUrl: s,
+    ...d
   }) => {
-    const [s, p] = G(null), l = L((h) => {
-      p(h);
+    const [c, y] = k(null), m = L((u) => {
+      y(u);
     }, []);
     I(() => {
-      s && (c ? xe(s, c) : we(s));
-    }, [s, c]);
-    const m = /* @__PURE__ */ r(
-      Me,
+      c && (p ? Re(c, p) : ve(c));
+    }, [c, p]);
+    const h = /* @__PURE__ */ r(
+      _e,
       {
         rapidlyChangingMotionState: e,
         dhParameters: t,
-        ...g
+        ...d
       }
     );
-    return /* @__PURE__ */ x(
-      pe,
+    return /* @__PURE__ */ w(
+      de,
       {
-        fallback: m,
-        onError: (h) => {
-          console.warn(h);
+        fallback: h,
+        onError: (u) => {
+          console.warn(u);
         },
         children: [
-          /* @__PURE__ */ r(le, { fallback: m, children: /* @__PURE__ */ r("group", { ref: l, children: /* @__PURE__ */ r(
-            ve,
+          /* @__PURE__ */ r(fe, { fallback: h, children: /* @__PURE__ */ r("group", { ref: m, children: /* @__PURE__ */ r(
+            Se,
             {
               rapidlyChangingMotionState: e,
               dhParameters: t,
+              chainOffsetPosition: a,
+              chainOffsetQuaternion: i,
               children: /* @__PURE__ */ r(
-                be,
+                we,
                 {
                   modelURL: (() => {
-                    const h = a(n, o);
-                    if (!h) {
-                      const d = new Blob([], { type: "model/gltf-binary" }), u = new File(
-                        [d],
+                    const u = f(n, s);
+                    if (!u) {
+                      const b = new Blob([], { type: "model/gltf-binary" }), g = new File(
+                        [b],
                         `${n}.glb`,
                         { type: "model/gltf-binary" }
                       );
-                      return Promise.resolve(URL.createObjectURL(u));
+                      return Promise.resolve(URL.createObjectURL(g));
                     }
-                    return h;
+                    return u;
                   })(),
-                  postModelRender: f,
-                  flangeRef: i,
-                  ...g
+                  postModelRender: o,
+                  flangeRef: l,
+                  ...d
                 }
               )
             }
           ) }) }),
-          /* @__PURE__ */ r(ge, {})
+          /* @__PURE__ */ r(xe, {})
         ]
       }
     );
   }
-), et = A(
+), tt = A(
   ({ rapidlyChangingMotionState: e, ...n }) => {
-    const t = H(
+    const t = Q(
       e
     );
     return /* @__PURE__ */ r(
-      Se,
+      Te,
       {
         rapidlyChangingMotionState: t,
         ...n
@@ -1261,9 +1297,9 @@ const Se = A(
     );
   }
 );
-function kt({
+function Pt({
   connectedMotionGroup: e,
-  getModel: n = V,
+  getModel: n = W,
   flangeRef: t,
   transparentColor: a,
   postModelRender: i,
@@ -1271,33 +1307,37 @@ function kt({
 }) {
   if (!e.dhParameters)
     return null;
-  const c = e.modelFromController || "";
-  return c && n(c) ? /* @__PURE__ */ r(
-    et,
+  const l = e.mountingPosition, o = e.mountingQuaternion, p = e.modelFromController || "";
+  return p && n(p) ? /* @__PURE__ */ r(
+    tt,
     {
       rapidlyChangingMotionState: e.rapidlyChangingMotionState,
-      modelFromController: c,
+      modelFromController: p,
       dhParameters: e.dhParameters,
       getModel: n,
       flangeRef: t,
       transparentColor: a,
       postModelRender: i,
+      chainOffsetPosition: l,
+      chainOffsetQuaternion: o,
       ...f
     }
   ) : /* @__PURE__ */ r(
-    Me,
+    _e,
     {
       rapidlyChangingMotionState: e.rapidlyChangingMotionState,
       dhParameters: e.dhParameters,
+      chainOffsetPosition: l,
+      chainOffsetQuaternion: o,
       ...f
     }
   );
 }
-const ae = {
-  [S.Abb]: [0, 0, 0, 0, Math.PI / 2, 0, 0],
-  [S.Fanuc]: [0, 0, 0, 0, -Math.PI / 2, 0, 0],
-  [S.Yaskawa]: [0, 0, 0, 0, -Math.PI / 2, 0, 0],
-  [S.Kuka]: [
+const le = {
+  [_.Abb]: [0, 0, 0, 0, Math.PI / 2, 0, 0],
+  [_.Fanuc]: [0, 0, 0, 0, -Math.PI / 2, 0, 0],
+  [_.Yaskawa]: [0, 0, 0, 0, -Math.PI / 2, 0, 0],
+  [_.Kuka]: [
     0,
     -Math.PI / 2,
     Math.PI / 2,
@@ -1306,7 +1346,7 @@ const ae = {
     0,
     0
   ],
-  [S.Universalrobots]: [
+  [_.Universalrobots]: [
     0,
     -Math.PI / 2,
     -Math.PI / 2,
@@ -1315,46 +1355,46 @@ const ae = {
     -Math.PI / 2,
     0
   ],
-  [S.Staubli]: [0, -Math.PI / 2, Math.PI / 2, 0, 0, 0, 0]
+  [_.Staubli]: [0, -Math.PI / 2, Math.PI / 2, 0, 0, 0, 0]
 };
-function tt(e) {
+function nt(e) {
   const [n] = e.split("_");
   switch (n) {
     case "ABB":
-      return S.Abb;
+      return _.Abb;
     case "FANUC":
-      return S.Fanuc;
+      return _.Fanuc;
     case "YASKAWA":
-      return S.Yaskawa;
+      return _.Yaskawa;
     case "KUKA":
-      return S.Kuka;
+      return _.Kuka;
     case "UniversalRobots":
-      return S.Universalrobots;
+      return _.Universalrobots;
     case "STAUBLI":
-      return S.Staubli;
+      return _.Staubli;
     default:
       return null;
   }
 }
-function Gt(e, n) {
-  const t = tt(e);
-  return t && t in ae ? ae[t] : n || null;
+function kt(e, n) {
+  const t = nt(e);
+  return t && t in le ? le[t] : n || null;
 }
-const nt = A((e) => {
-  const { inverseSolver: n, dhParameters: t, ...a } = e, [i, f] = G(
-    C.RevoluteJoint
+const rt = A((e) => {
+  const { inverseSolver: n, dhParameters: t, ...a } = e, [i, f] = k(
+    B.RevoluteJoint
   );
   I(() => {
-    t.length && f(t[0].type ?? C.RevoluteJoint);
+    t.length && f(t[0].type ?? B.RevoluteJoint);
   }, [t]);
-  const c = F(() => n === null && i === C.RevoluteJoint, [n, i]), o = F(() => n === null && i === C.PrismaticJoint, [n, i]);
-  return F(() => !!n, [n]) || c ? /* @__PURE__ */ r(Re, { dhParameters: t, ...a }) : o ? /* @__PURE__ */ r(Se, { dhParameters: t, ...a }) : null;
+  const l = D(() => n === null && i === B.RevoluteJoint, [n, i]), o = D(() => n === null && i === B.PrismaticJoint, [n, i]);
+  return D(() => !!n, [n]) || l ? /* @__PURE__ */ r(Me, { dhParameters: t, ...a }) : o ? /* @__PURE__ */ r(Te, { dhParameters: t, ...a }) : null;
 }), Lt = A((e) => {
-  const n = H(
+  const n = Q(
     e.rapidlyChangingMotionState
   );
   return /* @__PURE__ */ r(
-    nt,
+    rt,
     {
       ...e,
       rapidlyChangingMotionState: n
@@ -1363,21 +1403,21 @@ const nt = A((e) => {
 });
 export {
   vt as C,
-  kt as L,
-  ae as M,
-  ie as P,
-  _t as R,
+  Pt as L,
+  le as M,
+  ae as P,
+  et as R,
   Mt as S,
   St as T,
-  Tt as a,
-  ze as b,
-  Se as c,
-  V as d,
-  tt as e,
-  et as f,
-  Gt as g,
-  Re as h,
-  Qe as i,
+  Lt as a,
+  rt as b,
+  _t as c,
+  tt as d,
+  Te as e,
+  ze as f,
+  Me as g,
+  Tt as h,
+  W as i,
   nt as j,
-  Lt as k
+  kt as k
 };