@wandelbots/wandelbots-js-react-components 4.6.0 → 4.7.0

package/dist/MotionGroupVisualizer-BlWkdkaM.js

@@ -1,1338 +0,0 @@
-import { j as t, e as O } from "./externalizeComponent-Dc3fViZA.js";
-import * as x from "three";
-import { Matrix4 as w, Vector3 as V, Quaternion as J } from "three";
-import { ConvexGeometry as re } from "three-stdlib";
-import ve, { useEffect as M, useMemo as F, useRef as R, useCallback as T, useState as S, Suspense as oe } from "react";
-import { useThree as se, useFrame as ie, Canvas as Y } from "@react-three/fiber";
-import { Environment as _e, Lightformer as A, Line as z, useGLTF as Te, Bounds as X } from "@react-three/drei";
-import { useTheme as Ve, Card as Se, Box as b, Typography as K, Divider as Q, Button as Z } from "@mui/material";
-import { observer as Ae } from "mobx-react-lite";
-import { useTranslation as Fe } from "react-i18next";
-import { N as Le, V as ae, c as le, b as ee, M as v, J as D } from "./interpolation-BxZtUOAs.js";
-import { ErrorBoundary as ce } from "react-error-boundary";
-function Ge(e) {
-  switch (e.shape_type) {
-    case "convex_hull":
-      return new re(
-        e.vertices.map(
-          (n) => new x.Vector3(
-            n[0] / 1e3,
-            n[1] / 1e3,
-            n[2] / 1e3
-          )
-        )
-      );
-    case "box":
-      return new x.BoxGeometry(
-        e.size_x / 1e3,
-        e.size_y / 1e3,
-        e.size_z / 1e3
-      );
-    case "sphere":
-      return new x.SphereGeometry(e.radius / 1e3);
-    case "capsule":
-      return new x.CapsuleGeometry(
-        e.radius / 1e3,
-        e.cylinder_height / 1e3
-      );
-    case "cylinder":
-      return new x.CylinderGeometry(
-        e.radius / 1e3,
-        e.radius / 1e3,
-        e.height / 1e3
-      );
-    case "rectangle":
-      return new x.BoxGeometry(e.size_x / 1e3, e.size_y / 1e3, 0);
-    default:
-      return console.warn(`${e.shape_type} is not supported`), new x.BufferGeometry();
-  }
-}
-function Pe({
-  name: e,
-  collider: r,
-  children: n
-}) {
-  var d, u;
-  const l = ((d = r.pose) == null ? void 0 : d.position) ?? [0, 0, 0], i = ((u = r.pose) == null ? void 0 : u.orientation) ?? [0, 0, 0];
-  return r.margin && console.warn(`${e} margin is not supported`), /* @__PURE__ */ t.jsx(
-    "mesh",
-    {
-      name: e,
-      position: new x.Vector3(
-        l[0],
-        l[1],
-        l[2]
-      ).divideScalar(1e3),
-      rotation: new x.Euler(i[0], i[1], i[2], "XYZ"),
-      geometry: Ge(r.shape),
-      children: n
-    }
-  );
-}
-function ke({
-  name: e,
-  colliders: r,
-  meshChildrenProvider: n,
-  ...l
-}) {
-  return /* @__PURE__ */ t.jsx("group", { name: e, ...l, children: Object.entries(r).map(([i, d]) => /* @__PURE__ */ t.jsx(
-    Pe,
-    {
-      name: i,
-      collider: d,
-      children: n(i, d)
-    },
-    i
-  )) });
-}
-function ot({
-  scene: e,
-  meshChildrenProvider: r
-}) {
-  const n = e.colliders;
-  return /* @__PURE__ */ t.jsx("group", { children: n && /* @__PURE__ */ t.jsx(
-    ke,
-    {
-      meshChildrenProvider: r,
-      colliders: n
-    }
-  ) });
-}
-function te() {
-  return /* @__PURE__ */ t.jsx(_e, { children: /* @__PURE__ */ t.jsx(Ie, {}) });
-}
-function Ie({ positions: e = [2, 0, 2, 0, 2, 0, 2, 0] }) {
-  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-    /* @__PURE__ */ t.jsx(
-      A,
-      {
-        intensity: 5,
-        "rotation-x": Math.PI / 2,
-        position: [0, 5, -9],
-        scale: [10, 10, 1]
-      }
-    ),
-    /* @__PURE__ */ t.jsx("group", { rotation: [0, 0.5, 0], children: /* @__PURE__ */ t.jsx("group", { children: e.map((r, n) => /* @__PURE__ */ t.jsx(
-      A,
-      {
-        form: "circle",
-        intensity: 5,
-        rotation: [Math.PI / 2, 0, 0],
-        position: [r, 4, n * 4],
-        scale: [3, 1, 1]
-      },
-      n
-    )) }) }),
-    /* @__PURE__ */ t.jsx(
-      A,
-      {
-        intensity: 40,
-        "rotation-y": Math.PI / 2,
-        position: [-5, 1, -1],
-        scale: [20, 0.1, 1]
-      }
-    ),
-    /* @__PURE__ */ t.jsx(
-      A,
-      {
-        intensity: 20,
-        "rotation-y": -Math.PI,
-        position: [-5, -2, -1],
-        scale: [20, 0.1, 1]
-      }
-    ),
-    /* @__PURE__ */ t.jsx(
-      A,
-      {
-        "rotation-y": Math.PI / 2,
-        position: [-5, -1, -1],
-        scale: [20, 0.5, 1],
-        intensity: 5
-      }
-    ),
-    /* @__PURE__ */ t.jsx(
-      A,
-      {
-        "rotation-y": -Math.PI / 2,
-        position: [10, 1, 0],
-        scale: [20, 1, 1],
-        intensity: 10
-      }
-    ),
-    /* @__PURE__ */ t.jsx(
-      A,
-      {
-        form: "ring",
-        color: "white",
-        intensity: 5,
-        scale: 10,
-        position: [-15, 4, -18],
-        target: [0, 0, 0]
-      }
-    )
-  ] });
-}
-function De(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), l = new x.Vector3(e[2].x, e[2].y, e[2].z), i = new x.Vector3().subVectors(n, r), d = new x.Vector3().subVectors(l, r), u = new x.Vector3().crossVectors(i, d).normalize();
-  for (let m = 3; m < e.length; m++) {
-    const f = new x.Vector3(e[m].x, e[m].y, e[m].z), s = new x.Vector3().subVectors(f, r), p = u.dot(s);
-    if (Math.abs(p) > 1e-6)
-      return console.log("Vertices are not on the same plane"), { isCoplanar: !1 };
-  }
-  return { isCoplanar: !0, normal: u };
-}
-function st({
-  safetyZones: e,
-  dhParameters: r,
-  ...n
-}) {
-  M(() => {
-    Array.isArray(e) && console.warn("SafetyZonesRenderer: The support of V1 safety zones is deprecated. Please migrate to V2 safety zones.");
-  }, [e]);
-  const l = (s, p) => {
-    const o = De(s);
-    if (o.isCoplanar && o.normal) {
-      const y = new x.Vector3().addVectors(
-        s[0],
-        o.normal.multiplyScalar(1e-4)
-      );
-      s.push(y);
-    }
-    let a;
-    try {
-      a = new re(s);
-    } catch (c) {
-      return console.log("Error creating ConvexGeometry:", c), null;
-    }
-    return /* @__PURE__ */ t.jsx("mesh", { geometry: a, children: /* @__PURE__ */ t.jsx(
-      "meshStandardMaterial",
-      {
-        attach: "material",
-        color: "#009f4d",
-        opacity: 0.2,
-        depthTest: !1,
-        depthWrite: !1,
-        transparent: !0,
-        polygonOffset: !0,
-        polygonOffsetFactor: -p
-      },
-      `safety-zone-material-${p}`
-    ) }, `safety-zone-mesh-${p}`);
-  }, i = F(() => {
-    if (!r || r.length === 0)
-      return 5;
-    const o = r.reduce((a, c) => a + Math.abs(c.a ?? 0) / 1e3 + Math.abs(c.d ?? 0) / 1e3, 0) * 2;
-    return !Number.isFinite(o) || o <= 0 ? 5 : o;
-  }, [r]), d = (s, p, o) => {
-    const a = p.length(), c = new x.Quaternion();
-    if (a > 1e-6) {
-      const y = p.clone().normalize();
-      c.setFromAxisAngle(y, a);
-    }
-    return /* @__PURE__ */ t.jsxs(
-      "mesh",
-      {
-        renderOrder: o,
-        position: s,
-        quaternion: c,
-        children: [
-          /* @__PURE__ */ t.jsx("planeGeometry", { args: [i, i] }),
-          /* @__PURE__ */ t.jsx(
-            "meshStandardMaterial",
-            {
-              attach: "material",
-              color: "#009f4d",
-              opacity: 0.2,
-              depthTest: !1,
-              depthWrite: !1,
-              transparent: !0,
-              side: x.DoubleSide,
-              polygonOffset: !0,
-              polygonOffsetFactor: -o
-            },
-            `safety-zone-plane-material-${o}`
-          )
-        ]
-      },
-      `safety-zone-plane-${o}`
-    );
-  }, u = () => Object.values(e ?? {}).map((s, p) => {
-    var o, a;
-    switch (s.shape.shape_type) {
-      case "convex_hull":
-        return l(
-          s.shape.vertices.map((c) => new x.Vector3(c[0] / 1e3, c[1] / 1e3, c[2] / 1e3)),
-          p
-        );
-      case "plane":
-        return ((o = s == null ? void 0 : s.pose) == null ? void 0 : o.position) && ((a = s == null ? void 0 : s.pose) == null ? void 0 : a.orientation) && d(
-          new x.Vector3(s.pose.position[0] / 1e3, s.pose.position[1] / 1e3, s.pose.position[2] / 1e3),
-          new x.Vector3(s.pose.orientation[0], s.pose.orientation[1], s.pose.orientation[2]),
-          p
-        );
-    }
-  }), m = () => Array.isArray(e) ? e.map((s, p) => {
-    let o = [];
-    return s.geometry && (s.geometry.compound ? o = s.geometry.compound.child_geometries : s.geometry.convex_hull && (o = [s.geometry])), o.map((a, c) => {
-      if (!a.convex_hull) return null;
-      const y = a.convex_hull.vertices.map(
-        (h) => new x.Vector3(h.x / 1e3, h.y / 1e3, h.z / 1e3)
-      );
-      return l(y, p * 1e3 + c);
-    });
-  }) : null, f = F(() => Array.isArray(e) ? m() : u(), [e, m, u]);
-  return /* @__PURE__ */ t.jsx("group", { ...n, children: f });
-}
-function it({
-  trajectory: e,
-  ...r
-}) {
-  var l;
-  const n = ((l = e.trajectory) == null ? void 0 : l.map((i) => i.tcp_pose ? new x.Vector3(
-    i.tcp_pose.position.x / 1e3,
-    i.tcp_pose.position.z / 1e3,
-    -i.tcp_pose.position.y / 1e3
-  ) : null).filter((i) => i !== null)) || [];
-  return /* @__PURE__ */ t.jsx("group", { ...r, children: n.length > 0 && /* @__PURE__ */ t.jsx(
-    z,
-    {
-      points: n,
-      lineWidth: 3,
-      polygonOffset: !0,
-      polygonOffsetFactor: 10,
-      polygonOffsetUnits: 10
-    }
-  ) });
-}
-const E = /* @__PURE__ */ new Map();
-async function C(e, r) {
-  if (E.has(e))
-    return E.get(e);
-  const n = (async () => {
-    var u;
-    const l = r || "", i = new Le({ instanceUrl: l }), d = i.api.motionGroupModels;
-    (u = d.axios) != null && u.interceptors && d.axios.interceptors.request.use((m) => {
-      var f;
-      return (f = m.url) != null && f.includes("/glb") && (m.responseType = "blob"), m;
-    });
-    try {
-      const m = await i.api.motionGroupModels.getMotionGroupGlbModel(e);
-      return URL.createObjectURL(m);
-    } catch (m) {
-      throw console.error("Failed to fetch model:", m), m;
-    }
-  })();
-  return E.set(e, n), n;
-}
-function ue(e) {
-  function r(n) {
-    return n.children.length === 0 ? [n] : [n, ...n.children.flatMap((l) => r(l))];
-  }
-  return r(e).filter((n) => de(n));
-}
-function fe(e) {
-  return e.name.endsWith("_FLG");
-}
-function de(e) {
-  return /_J[0-9]+$/.test(e.name);
-}
-function Oe(e, r) {
-  let n;
-  function l(i) {
-    if (fe(i)) {
-      if (n)
-        throw Error(
-          `Found multiple flange groups in robot model ${r}; first ${n.name} then ${i.name}. Only one _FLG group is allowed.`
-        );
-      n = i;
-    }
-    de(i), i.children.map(l);
-  }
-  if (l(e.scene), !n)
-    throw Error(
-      `No flange group found in robot model ${r}. Flange must be identified with a name ending in _FLG.`
-    );
-  return { gltf: e };
-}
-function pe({
-  rapidlyChangingMotionState: e,
-  dhParameters: r,
-  onRotationChanged: n,
-  children: l
-}) {
-  const i = R([]), d = R([]), u = R(null), { invalidate: m } = se();
-  M(() => {
-    const o = e.joint_position.filter(
-      (a) => a !== void 0
-    );
-    return u.current = new ae(o, {
-      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 a;
-      (a = u.current) == null || a.destroy();
-    };
-  }, []), ie((o, a) => {
-    if (u.current) {
-      const c = u.current.update(a);
-      s(), c || m();
-    }
-  });
-  function f(o) {
-    o && (d.current = ue(o), s(), m());
-  }
-  function s() {
-    var a;
-    const o = ((a = u.current) == null ? void 0 : a.getCurrentValues()) || [];
-    if (n)
-      n(d.current, o);
-    else
-      for (const [c, y] of d.current.entries()) {
-        const h = r[c], j = h.theta || 0, g = h.reverse_rotation_direction ? -1 : 1;
-        y.rotation.y = g * (o[c] || 0) + j;
-      }
-  }
-  const p = T(() => {
-    const o = e.joint_position.filter(
-      (a) => a !== void 0
-    );
-    requestAnimationFrame(() => {
-      var a;
-      i.current = o, (a = u.current) == null || a.setTarget(o);
-    });
-  }, [e]);
-  return M(() => {
-    p();
-  }, [e, p]), le(() => {
-    p();
-  }), /* @__PURE__ */ t.jsx("group", { ref: f, children: l });
-}
-const Ce = "line", Ue = "mesh";
-function Ee({
-  rapidlyChangingMotionState: e,
-  dhParameters: r,
-  ...n
-}) {
-  const l = new w(), i = R([]), d = R([]);
-  ve.useEffect(() => {
-    i.current = new Array(r.length).fill(null), d.current = new Array(r.length).fill(null);
-  }, [r.length]);
-  function u(s, p) {
-    const o = new V(), a = new J(), c = new V();
-    l.decompose(o, a, c);
-    const y = o.clone(), h = new w().makeRotationY(
-      s.theta + p * (s.reverse_rotation_direction ? -1 : 1)
-    ).multiply(new w().makeTranslation(0, s.d / 1e3, 0)).multiply(new w().makeTranslation(s.a / 1e3, 0, 0)).multiply(new w().makeRotationX(s.alpha));
-    return l.multiply(h), l.decompose(o, a, c), { a: y, b: o };
-  }
-  function m(s, p, o, a) {
-    if (!r)
-      return;
-    const c = r[s];
-    if (!c)
-      return;
-    const { a: y, b: h } = u(c, a);
-    p.geometry.setPositions([y.toArray(), h.toArray()].flat()), o.position.set(h.x, h.y, h.z);
-  }
-  function f(s, p) {
-    l.identity();
-    for (let o = 0; o < Math.min(s.length, p.length); o++) {
-      const a = i.current[o], c = d.current[o];
-      a && c && m(o, a, c, p[o]);
-    }
-  }
-  return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsx(
-    pe,
-    {
-      rapidlyChangingMotionState: e,
-      dhParameters: r,
-      onRotationChanged: f,
-      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((s, p) => {
-          const { a: o, b: a } = u(
-            s,
-            e.joint_position[p] ?? 0
-          ), c = `dhrobot_J0${p}`;
-          return /* @__PURE__ */ t.jsxs("group", { name: c, children: [
-            /* @__PURE__ */ t.jsx(
-              z,
-              {
-                ref: (y) => {
-                  i.current[p] = y;
-                },
-                name: Ce,
-                points: [o, a],
-                color: "white",
-                lineWidth: 5
-              }
-            ),
-            /* @__PURE__ */ t.jsxs(
-              "mesh",
-              {
-                ref: (y) => {
-                  d.current[p] = y;
-                },
-                name: Ue,
-                position: a,
-                children: [
-                  /* @__PURE__ */ t.jsx("sphereGeometry", { args: [0.01, 32, 32] }),
-                  /* @__PURE__ */ t.jsx("meshStandardMaterial", { color: "black", depthTest: !0 })
-                ]
-              },
-              "mesh_" + p
-            )
-          ] }, c);
-        })
-      ] })
-    }
-  ) });
-}
-const Je = console.warn;
-function me() {
-  return M(() => {
-    console.warn = (e) => {
-      e !== "Cannot call the manual advancement of rafz whilst frameLoop is not set as demand" && Je(e);
-    };
-  }, []), /* @__PURE__ */ t.jsx(t.Fragment, {});
-}
-function ze(e) {
-  return e.type === "Mesh";
-}
-function Be({
-  url: e,
-  flangeRef: r,
-  postModelRender: n,
-  ...l
-}) {
-  const i = Te(e);
-  let d;
-  try {
-    d = Oe(i, "robot.glb").gltf;
-  } catch (f) {
-    throw f;
-  }
-  const u = T(
-    (f) => {
-      f && n && n();
-    },
-    [n]
-  );
-  function m(f) {
-    try {
-      return ze(f) ? f.geometry ? /* @__PURE__ */ t.jsx(
-        "mesh",
-        {
-          name: f.name,
-          geometry: f.geometry,
-          material: f.material,
-          position: f.position,
-          rotation: f.rotation
-        },
-        f.uuid
-      ) : /* @__PURE__ */ t.jsx("group", { name: f.name, position: f.position, rotation: f.rotation }, f.uuid) : /* @__PURE__ */ t.jsx(
-        "group",
-        {
-          name: f.name,
-          position: f.position,
-          rotation: f.rotation,
-          ref: fe(f) ? r : void 0,
-          children: f.children.map(m)
-        },
-        f.uuid
-      );
-    } catch (s) {
-      return console.warn("Error rendering node", f.name, s), null;
-    }
-  }
-  return /* @__PURE__ */ t.jsx("group", { ...l, dispose: null, ref: u, children: m(d.scene) });
-}
-function he({
-  modelURL: e,
-  flangeRef: r,
-  postModelRender: n,
-  ...l
-}) {
-  const [i, d] = S(null);
-  return M(() => {
-    (async () => {
-      try {
-        if (typeof e == "string")
-          d(e);
-        else {
-          const m = await e;
-          d(m);
-        }
-      } catch (m) {
-        console.error("Failed to resolve model URL:", m);
-      }
-    })();
-  }, [e]), i ? /* @__PURE__ */ t.jsx(
-    Be,
-    {
-      url: i,
-      flangeRef: r,
-      postModelRender: n,
-      ...l
-    }
-  ) : null;
-}
-const xe = (e, r) => {
-  e.userData.isGhost || (e.traverse((n) => {
-    if (n instanceof x.Mesh) {
-      n.material instanceof x.Material && (n.material.colorWrite = !1);
-      const l = n.clone(), i = n.clone();
-      l.material = new x.MeshStandardMaterial({
-        depthTest: !0,
-        depthWrite: !0,
-        colorWrite: !1,
-        polygonOffset: !0,
-        polygonOffsetFactor: -1,
-        side: x.DoubleSide
-      }), l.userData.isGhost = !0, i.material = new x.MeshStandardMaterial({
-        color: r,
-        opacity: 0.3,
-        depthTest: !0,
-        depthWrite: !1,
-        transparent: !0,
-        polygonOffset: !0,
-        polygonOffsetFactor: -2,
-        side: x.DoubleSide
-      }), i.userData.isGhost = !0, n.parent && (n.parent.add(l), n.parent.add(i));
-    }
-  }), e.userData.isGhost = !0);
-}, ye = (e) => {
-  if (!e.userData.isGhost) return;
-  const r = [];
-  e.traverse((n) => {
-    var l;
-    n instanceof x.Mesh && ((l = n.userData) != null && l.isGhost ? r.push(n) : n.material instanceof x.Material && (n.material.colorWrite = !0));
-  }), r.forEach((n) => {
-    n.parent && n.parent.remove(n);
-  }), e.userData.isGhost = !1;
-}, ge = O(
-  ({
-    rapidlyChangingMotionState: e,
-    modelFromController: r,
-    dhParameters: n,
-    getModel: l = C,
-    flangeRef: i,
-    postModelRender: d,
-    transparentColor: u,
-    instanceUrl: m,
-    ...f
-  }) => {
-    const [s, p] = S(null), o = T((c) => {
-      p(c);
-    }, []);
-    M(() => {
-      s && (u ? xe(s, u) : ye(s));
-    }, [s, u]);
-    const a = /* @__PURE__ */ t.jsx(
-      Ee,
-      {
-        rapidlyChangingMotionState: e,
-        dhParameters: n,
-        ...f
-      }
-    );
-    return /* @__PURE__ */ t.jsxs(
-      ce,
-      {
-        fallback: a,
-        onError: (c) => {
-          console.warn(c);
-        },
-        children: [
-          /* @__PURE__ */ t.jsx(oe, { fallback: a, children: /* @__PURE__ */ t.jsx("group", { ref: o, children: /* @__PURE__ */ t.jsx(
-            pe,
-            {
-              rapidlyChangingMotionState: e,
-              dhParameters: n,
-              children: /* @__PURE__ */ t.jsx(
-                he,
-                {
-                  modelURL: (() => {
-                    const c = l(r, m);
-                    if (!c) {
-                      const y = new Blob([], { type: "model/gltf-binary" }), h = new File([y], `${r}.glb`, { type: "model/gltf-binary" });
-                      return Promise.resolve(URL.createObjectURL(h));
-                    }
-                    return c;
-                  })(),
-                  postModelRender: d,
-                  flangeRef: i,
-                  ...f
-                }
-              )
-            }
-          ) }) }),
-          /* @__PURE__ */ t.jsx(me, {})
-        ]
-      }
-    );
-  }
-);
-function We({
-  connectedMotionGroup: e,
-  getModel: r = C,
-  flangeRef: n,
-  transparentColor: l,
-  postModelRender: i,
-  ...d
-}) {
-  return e.dhParameters ? /* @__PURE__ */ t.jsx(
-    ge,
-    {
-      rapidlyChangingMotionState: e.rapidlyChangingMotionState,
-      modelFromController: e.modelFromController || "",
-      dhParameters: e.dhParameters,
-      getModel: r,
-      flangeRef: n,
-      transparentColor: l,
-      postModelRender: i,
-      ...d
-    }
-  ) : null;
-}
-const at = O(
-  Ae(
-    ({
-      robotName: e,
-      programState: r,
-      safetyState: n,
-      operationMode: l,
-      driveToHomeEnabled: i = !1,
-      onDriveToHomePress: d,
-      onDriveToHomeRelease: u,
-      connectedMotionGroup: m,
-      robotComponent: f = We,
-      customContentComponent: s,
-      className: p
-    }) => {
-      var $;
-      const o = Ve(), { t: a } = Fe(), [c, y] = S(!1), h = R(null), j = R(null), [g, U] = S(!1), [L, Re] = S({ width: 400, height: 600 }), [He, Me] = S(0);
-      M(() => {
-        const I = () => {
-          if (j.current) {
-            const { offsetWidth: N, offsetHeight: q } = j.current;
-            U(N > q), Re({ width: N, height: q });
-          }
-        };
-        I();
-        const H = new ResizeObserver(I);
-        return j.current && H.observe(j.current), () => {
-          H.disconnect();
-        };
-      }, []);
-      const B = T(() => {
-        Me((I) => I + 1);
-      }, []), G = T(() => {
-        !i || !d || (y(!0), d());
-      }, [i, d]), P = T(() => {
-        !i || !u || (y(!1), u());
-      }, [i, u]), W = T(() => {
-        c && u && (y(!1), u());
-      }, [c, u]), _ = g ? L.width < 350 : L.height < 200, k = g ? L.height < 310 : L.height < 450;
-      return /* @__PURE__ */ t.jsx(
-        Se,
-        {
-          ref: j,
-          className: p,
-          sx: {
-            width: "100%",
-            height: "100%",
-            display: "flex",
-            flexDirection: g ? "row" : "column",
-            position: "relative",
-            overflow: "hidden",
-            minWidth: { xs: 180, sm: 220, md: 250 },
-            minHeight: g ? { xs: 200, sm: 240, md: 260 } : { xs: 150, sm: 180, md: 220 },
-            // Allow progressive hiding in portrait mode
-            border: `1px solid ${o.palette.divider}`,
-            borderRadius: "18px",
-            boxShadow: "none",
-            backgroundColor: (($ = o.palette.backgroundPaperElevation) == null ? void 0 : $[8]) || "#2A2A3F",
-            backgroundImage: "none"
-            // Override any gradient from elevation
-          },
-          children: g ? /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-            /* @__PURE__ */ t.jsx(
-              b,
-              {
-                sx: {
-                  flex: "0 0 50%",
-                  position: "relative",
-                  height: "100%",
-                  minHeight: "100%",
-                  maxHeight: "100%",
-                  borderRadius: 1,
-                  m: { xs: 1.5, sm: 2, md: 3 },
-                  mr: { xs: 0.75, sm: 1, md: 1.5 },
-                  overflow: "hidden",
-                  // Prevent content from affecting container size
-                  display: _ ? "none" : "block"
-                },
-                children: !_ && /* @__PURE__ */ t.jsxs(
-                  Y,
-                  {
-                    orthographic: !0,
-                    camera: {
-                      position: [3, 2, 3],
-                      zoom: 1
-                    },
-                    shadows: !0,
-                    frameloop: "demand",
-                    style: {
-                      borderRadius: o.shape.borderRadius,
-                      width: "100%",
-                      height: "100%",
-                      background: "transparent",
-                      position: "absolute",
-                      top: 0,
-                      left: 0
-                    },
-                    dpr: [1, 2],
-                    gl: { alpha: !0, antialias: !0 },
-                    children: [
-                      /* @__PURE__ */ t.jsx(te, {}),
-                      /* @__PURE__ */ t.jsx(X, { fit: !0, observe: !0, margin: 1, maxDuration: 1, children: /* @__PURE__ */ t.jsx(
-                        f,
-                        {
-                          connectedMotionGroup: m,
-                          postModelRender: B
-                        }
-                      ) })
-                    ]
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ t.jsxs(
-              b,
-              {
-                sx: {
-                  flex: "1",
-                  display: "flex",
-                  flexDirection: "column",
-                  justifyContent: "flex-start",
-                  width: _ ? "100%" : "50%"
-                },
-                children: [
-                  /* @__PURE__ */ t.jsxs(
-                    b,
-                    {
-                      sx: {
-                        p: { xs: 1.5, sm: 2, md: 3 },
-                        pb: { xs: 1, sm: 1.5, md: 2 },
-                        textAlign: "left"
-                      },
-                      children: [
-                        /* @__PURE__ */ t.jsx(K, { variant: "h6", component: "h2", sx: { mb: 1 }, children: e }),
-                        /* @__PURE__ */ t.jsx(
-                          ee,
-                          {
-                            programState: r,
-                            safetyState: n,
-                            operationMode: l
-                          }
-                        )
-                      ]
-                    }
-                  ),
-                  /* @__PURE__ */ t.jsxs(
-                    b,
-                    {
-                      sx: {
-                        p: { xs: 1.5, sm: 2, md: 3 },
-                        pt: 0,
-                        flex: "1",
-                        display: "flex",
-                        flexDirection: "column",
-                        justifyContent: "space-between"
-                      },
-                      children: [
-                        !k && s && /* @__PURE__ */ t.jsxs(b, { children: [
-                          /* @__PURE__ */ t.jsx(s, {}),
-                          /* @__PURE__ */ t.jsx(
-                            Q,
-                            {
-                              sx: {
-                                mt: 1,
-                                mb: 0,
-                                borderColor: o.palette.divider,
-                                opacity: 0.5
-                              }
-                            }
-                          )
-                        ] }),
-                        /* @__PURE__ */ t.jsx(
-                          b,
-                          {
-                            sx: {
-                              mt: !k && s ? "auto" : 0
-                            },
-                            children: /* @__PURE__ */ t.jsx(
-                              b,
-                              {
-                                sx: {
-                                  display: "flex",
-                                  justifyContent: "flex-start",
-                                  mt: { xs: 1, sm: 1.5, md: 2 },
-                                  mb: { xs: 0.5, sm: 0.75, md: 1 }
-                                },
-                                children: /* @__PURE__ */ t.jsx(
-                                  Z,
-                                  {
-                                    ref: h,
-                                    variant: "contained",
-                                    color: "secondary",
-                                    size: "small",
-                                    disabled: !i,
-                                    onMouseDown: G,
-                                    onMouseUp: P,
-                                    onMouseLeave: W,
-                                    onTouchStart: G,
-                                    onTouchEnd: P,
-                                    sx: {
-                                      textTransform: "none",
-                                      px: 1.5,
-                                      py: 0.5
-                                    },
-                                    children: a("RobotCard.DriveToHome.bt")
-                                  }
-                                )
-                              }
-                            )
-                          }
-                        )
-                      ]
-                    }
-                  )
-                ]
-              }
-            )
-          ] }) : /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs(
-            b,
-            {
-              sx: {
-                p: 3,
-                height: "100%",
-                display: "flex",
-                flexDirection: "column"
-              },
-              children: [
-                /* @__PURE__ */ t.jsxs(b, { children: [
-                  /* @__PURE__ */ t.jsx(K, { variant: "h6", component: "h2", sx: { mb: 1 }, children: e }),
-                  /* @__PURE__ */ t.jsx(
-                    ee,
-                    {
-                      programState: r,
-                      safetyState: n,
-                      operationMode: l
-                    }
-                  )
-                ] }),
-                /* @__PURE__ */ t.jsx(
-                  b,
-                  {
-                    sx: {
-                      flex: _ ? 0 : 1,
-                      position: "relative",
-                      minHeight: _ ? 0 : { xs: 120, sm: 150, md: 200 },
-                      height: _ ? 0 : "auto",
-                      borderRadius: 1,
-                      overflow: "hidden",
-                      display: _ ? "none" : "block"
-                    },
-                    children: !_ && /* @__PURE__ */ t.jsxs(
-                      Y,
-                      {
-                        orthographic: !0,
-                        camera: {
-                          position: [3, 2, 3],
-                          zoom: 1
-                        },
-                        shadows: !0,
-                        frameloop: "demand",
-                        style: {
-                          borderRadius: o.shape.borderRadius,
-                          width: "100%",
-                          height: "100%",
-                          background: "transparent",
-                          position: "absolute"
-                        },
-                        dpr: [1, 2],
-                        gl: { alpha: !0, antialias: !0 },
-                        children: [
-                          /* @__PURE__ */ t.jsx(te, {}),
-                          /* @__PURE__ */ t.jsx(X, { fit: !0, clip: !0, observe: !0, margin: 1, maxDuration: 1, children: /* @__PURE__ */ t.jsx(
-                            f,
-                            {
-                              connectedMotionGroup: m,
-                              postModelRender: B
-                            }
-                          ) })
-                        ]
-                      }
-                    )
-                  }
-                ),
-                /* @__PURE__ */ t.jsxs(b, { children: [
-                  !k && s && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-                    /* @__PURE__ */ t.jsx(s, {}),
-                    /* @__PURE__ */ t.jsx(
-                      Q,
-                      {
-                        sx: {
-                          mt: 1,
-                          mb: 0,
-                          borderColor: o.palette.divider,
-                          opacity: 0.5
-                        }
-                      }
-                    )
-                  ] }),
-                  /* @__PURE__ */ t.jsx(
-                    b,
-                    {
-                      sx: {
-                        display: "flex",
-                        justifyContent: "flex-start",
-                        mt: !k && 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__ */ t.jsx(
-                        Z,
-                        {
-                          ref: h,
-                          variant: "contained",
-                          color: "secondary",
-                          size: "small",
-                          disabled: !i,
-                          onMouseDown: G,
-                          onMouseUp: P,
-                          onMouseLeave: W,
-                          onTouchStart: G,
-                          onTouchEnd: P,
-                          sx: {
-                            textTransform: "none",
-                            px: 1.5,
-                            py: 0.5
-                          },
-                          children: a("RobotCard.DriveToHome.bt")
-                        }
-                      )
-                    }
-                  )
-                ] })
-              ]
-            }
-          ) })
-        }
-      );
-    }
-  )
-), lt = Array(6).fill(2 * Math.PI);
-function je({
-  rapidlyChangingMotionState: e,
-  dhParameters: r,
-  onTranslationChanged: n,
-  children: l
-}) {
-  const i = R([]), d = R([]), u = R(null), { invalidate: m } = se();
-  M(() => {
-    const o = e.joint_position.filter(
-      (a) => a !== void 0
-    );
-    return u.current = new ae(o, {
-      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 a;
-      (a = u.current) == null || a.destroy();
-    };
-  }, []), ie((o, a) => {
-    if (u.current) {
-      const c = u.current.update(a);
-      s(), c || m();
-    }
-  });
-  function f(o) {
-    o && (d.current = ue(o), s(), m());
-  }
-  function s() {
-    var a;
-    const o = ((a = u.current) == null ? void 0 : a.getCurrentValues()) || [];
-    if (n)
-      n(d.current, o);
-    else
-      for (const [c, y] of d.current.entries()) {
-        const j = r[c].reverse_rotation_direction ? -1 : 1;
-        y.position.y = j * (o[c] || 0) / 1e3;
-      }
-  }
-  const p = T(() => {
-    const o = e.joint_position.filter(
-      (a) => a !== void 0
-    );
-    requestAnimationFrame(() => {
-      var a;
-      i.current = o, (a = u.current) == null || a.setTarget(o);
-    });
-  }, [e]);
-  return M(() => {
-    p();
-  }, [e, p]), le(() => {
-    p();
-  }), /* @__PURE__ */ t.jsx("group", { ref: f, children: l });
-}
-function we({
-  rapidlyChangingMotionState: e,
-  dhParameters: r,
-  ...n
-}) {
-  const l = new w(), i = R(null), d = R(null);
-  function u(s) {
-    const p = new w();
-    for (let y = 0; y < r.length; y++) {
-      const h = r[y], j = s[y] ?? 0, g = new w().makeRotationY(h.theta).multiply(
-        new w().makeTranslation(
-          h.a / 1e3,
-          (h.d + j * (h.reverse_rotation_direction ? -1 : 1)) / 1e3,
-          0
-        )
-      ).multiply(new w().makeRotationX(h.alpha));
-      p.multiply(g);
-    }
-    const o = new V(), a = new J(), c = new V();
-    return p.decompose(o, a, c), o;
-  }
-  const m = u(e.joint_position);
-  function f(s, p) {
-    l.identity();
-    let o = new V();
-    for (let h = 0; h < r.length; h++) {
-      const j = p[h] ?? 0, g = r[h], U = new w().makeRotationY(g.theta).multiply(
-        new w().makeTranslation(
-          g.a / 1e3,
-          (g.d + j * (g.reverse_rotation_direction ? -1 : 1)) / 1e3,
-          0
-        )
-      ).multiply(new w().makeRotationX(g.alpha));
-      l.multiply(U);
-    }
-    const a = new V(), c = new J(), y = new V();
-    if (l.decompose(a, c, y), o = a, i.current && i.current.position.set(o.x, o.y, o.z), d.current) {
-      const h = d.current.geometry;
-      h && h.setPositions && h.setPositions([0, 0, 0, o.x, o.y, o.z]);
-    }
-  }
-  return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsx(
-    je,
-    {
-      rapidlyChangingMotionState: e,
-      dhParameters: r,
-      onTranslationChanged: f,
-      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(
-          z,
-          {
-            ref: d,
-            points: [new V(0, 0, 0), m],
-            color: "White",
-            lineWidth: 5
-          }
-        ),
-        /* @__PURE__ */ t.jsxs("mesh", { ref: i, name: "TCP", position: m, children: [
-          /* @__PURE__ */ t.jsx("sphereGeometry", { args: [0.025, 32, 32] }),
-          /* @__PURE__ */ t.jsx("meshStandardMaterial", { color: "red", depthTest: !0 })
-        ] })
-      ] })
-    }
-  ) });
-}
-const be = O(
-  ({
-    rapidlyChangingMotionState: e,
-    modelFromController: r,
-    dhParameters: n,
-    getModel: l = C,
-    flangeRef: i,
-    postModelRender: d,
-    transparentColor: u,
-    instanceUrl: m,
-    ...f
-  }) => {
-    const [s, p] = S(null), o = T((c) => {
-      p(c);
-    }, []);
-    M(() => {
-      s && (u ? xe(s, u) : ye(s));
-    }, [s, u]);
-    const a = /* @__PURE__ */ t.jsx(
-      we,
-      {
-        rapidlyChangingMotionState: e,
-        dhParameters: n,
-        ...f
-      }
-    );
-    return /* @__PURE__ */ t.jsxs(
-      ce,
-      {
-        fallback: a,
-        onError: (c) => {
-          console.warn(c);
-        },
-        children: [
-          /* @__PURE__ */ t.jsx(oe, { fallback: a, children: /* @__PURE__ */ t.jsx("group", { ref: o, children: /* @__PURE__ */ t.jsx(
-            je,
-            {
-              rapidlyChangingMotionState: e,
-              dhParameters: n,
-              children: /* @__PURE__ */ t.jsx(
-                he,
-                {
-                  modelURL: (() => {
-                    const c = l(r, m);
-                    if (!c) {
-                      const y = new Blob([], { type: "model/gltf-binary" }), h = new File([y], `${r}.glb`, { type: "model/gltf-binary" });
-                      return Promise.resolve(URL.createObjectURL(h));
-                    }
-                    return c;
-                  })(),
-                  postModelRender: d,
-                  flangeRef: i,
-                  ...f
-                }
-              )
-            }
-          ) }) }),
-          /* @__PURE__ */ t.jsx(me, {})
-        ]
-      }
-    );
-  }
-);
-function ct({
-  connectedMotionGroup: e,
-  getModel: r = C,
-  flangeRef: n,
-  transparentColor: l,
-  postModelRender: i,
-  ...d
-}) {
-  if (!e.dhParameters)
-    return null;
-  const u = e.modelFromController || "";
-  return u && r(u) ? /* @__PURE__ */ t.jsx(
-    be,
-    {
-      rapidlyChangingMotionState: e.rapidlyChangingMotionState,
-      modelFromController: u,
-      dhParameters: e.dhParameters,
-      getModel: r,
-      flangeRef: n,
-      transparentColor: l,
-      postModelRender: i,
-      ...d
-    }
-  ) : /* @__PURE__ */ t.jsx(
-    we,
-    {
-      rapidlyChangingMotionState: e.rapidlyChangingMotionState,
-      dhParameters: e.dhParameters,
-      ...d
-    }
-  );
-}
-const ne = {
-  [v.Abb]: [0, 0, 0, 0, Math.PI / 2, 0, 0],
-  [v.Fanuc]: [0, 0, 0, 0, -Math.PI / 2, 0, 0],
-  [v.Yaskawa]: [0, 0, 0, 0, -Math.PI / 2, 0, 0],
-  [v.Kuka]: [
-    0,
-    -Math.PI / 2,
-    Math.PI / 2,
-    0,
-    Math.PI / 2,
-    0,
-    0
-  ],
-  [v.Universalrobots]: [
-    0,
-    -Math.PI / 2,
-    -Math.PI / 2,
-    -Math.PI / 2,
-    Math.PI / 2,
-    -Math.PI / 2,
-    0
-  ]
-};
-function $e(e) {
-  const [r] = e.split("_");
-  switch (r) {
-    case "ABB":
-      return v.Abb;
-    case "FANUC":
-      return v.Fanuc;
-    case "YASKAWA":
-      return v.Yaskawa;
-    case "KUKA":
-      return v.Kuka;
-    case "UniversalRobots":
-      return v.Universalrobots;
-    default:
-      return null;
-  }
-}
-function ut(e, r) {
-  const n = $e(e);
-  return n && n in ne ? ne[n] : r || null;
-}
-const ft = O((e) => {
-  const {
-    inverseSolver: r,
-    dhParameters: n,
-    ...l
-  } = e, [i, d] = S(D.RevoluteJoint);
-  M(() => {
-    n.length && d(n[0].type ?? D.RevoluteJoint);
-  }, [n]);
-  const u = F(() => r === null && i === D.RevoluteJoint, [r, i]), m = F(() => r === null && i === D.PrismaticJoint, [r, i]);
-  return F(() => !!r, [r]) || u ? /* @__PURE__ */ t.jsx(ge, { dhParameters: n, ...l }) : m ? /* @__PURE__ */ t.jsx(be, { dhParameters: n, ...l }) : /* @__PURE__ */ t.jsx(t.Fragment, {});
-});
-export {
-  ot as C,
-  ct as L,
-  ne as M,
-  te as P,
-  We as R,
-  st as S,
-  it as T,
-  ft as a,
-  at as b,
-  be as c,
-  ge as d,
-  lt as e,
-  C as f,
-  $e as g,
-  ut as h
-};
-//# sourceMappingURL=MotionGroupVisualizer-BlWkdkaM.js.map