@wandelbots/wandelbots-js-react-components 4.7.1 → 4.7.2-pr.dev-RB-3348-v1-clean-up.560.cbf9c17

package/dist/MotionGroupVisualizer-7Mw9PINy.js

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