@nice2dev/ui-3d 1.3.15 → 1.3.17

package/dist/cjs/model/NicePhysicsSimulation.js

@@ -1,324 +1,554 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var ui = require('@nice2dev/ui');
-var React = require('react');
-var THREE = require('three');
-var i18n = require('../core/i18n.js');
-
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const ui = require("@nice2dev/ui");
+const React = require("react");
+const THREE = require("three");
+const i18n = require("../core/i18n.js");
 function _interopNamespaceDefault(e) {
-    var n = Object.create(null);
-    if (e) {
-        Object.keys(e).forEach(function (k) {
-            if (k !== 'default') {
-                var d = Object.getOwnPropertyDescriptor(e, k);
-                Object.defineProperty(n, k, d.get ? d : {
-                    enumerable: true,
-                    get: function () { return e[k]; }
-                });
-            }
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
         });
+      }
     }
-    n.default = e;
-    return Object.freeze(n);
+  }
+  n.default = e;
+  return Object.freeze(n);
 }
-
-var THREE__namespace = /*#__PURE__*/_interopNamespaceDefault(THREE);
-
+const THREE__namespace = /* @__PURE__ */ _interopNamespaceDefault(THREE);
 function inferColliderShape(object) {
-    if (object instanceof THREE__namespace.Mesh) {
-        const geo = object.geometry;
-        if (geo instanceof THREE__namespace.SphereGeometry) {
-            return 'sphere';
-        }
-        if (geo instanceof THREE__namespace.CapsuleGeometry) {
-            return 'capsule';
-        }
-        if (geo instanceof THREE__namespace.BoxGeometry) {
-            return 'box';
-        }
-        // Complex meshes default to convex hull
-        if (geo.attributes.position && geo.attributes.position.count > 24) {
-            return 'convexHull';
-        }
+  if (object instanceof THREE__namespace.Mesh) {
+    const geo = object.geometry;
+    if (geo instanceof THREE__namespace.SphereGeometry) {
+      return "sphere";
+    }
+    if (geo instanceof THREE__namespace.CapsuleGeometry) {
+      return "capsule";
+    }
+    if (geo instanceof THREE__namespace.BoxGeometry) {
+      return "box";
+    }
+    if (geo.attributes.position && geo.attributes.position.count > 24) {
+      return "convexHull";
     }
-    return 'box';
+  }
+  return "box";
 }
 function computeAABB(object) {
-    return new THREE__namespace.Box3().setFromObject(object);
+  return new THREE__namespace.Box3().setFromObject(object);
 }
-/* ── Hook ── */
 let bodyIdCounter = 0;
 let jointIdCounter = 0;
 function usePhysicsSimulation(scene, onSimulationStep) {
-    const [worldConfig, setWorldConfigState] = React.useState({
-        gravity: new THREE__namespace.Vector3(0, -9.81, 0),
-        timestep: 1 / 60,
-        maxSubsteps: 4,
-    });
-    const [bodies, setBodies] = React.useState([]);
-    const [joints, setJoints] = React.useState([]);
-    const [isRunning, setIsRunning] = React.useState(false);
-    const [debugDraw, setDebugDraw] = React.useState(false);
-    const internalBodies = React.useRef(new Map());
-    const debugGroup = React.useRef(new THREE__namespace.Group());
-    const animFrameId = React.useRef(0);
-    const lastTime = React.useRef(0);
-    // Debug wireframe colliders
-    React.useEffect(() => {
-        if (!scene) {
-            return;
+  const [worldConfig, setWorldConfigState] = React.useState({
+    gravity: new THREE__namespace.Vector3(0, -9.81, 0),
+    timestep: 1 / 60,
+    maxSubsteps: 4
+  });
+  const [bodies, setBodies] = React.useState([]);
+  const [joints, setJoints] = React.useState([]);
+  const [isRunning, setIsRunning] = React.useState(false);
+  const [debugDraw, setDebugDraw] = React.useState(false);
+  const internalBodies = React.useRef(/* @__PURE__ */ new Map());
+  const debugGroup = React.useRef(new THREE__namespace.Group());
+  const animFrameId = React.useRef(0);
+  const lastTime = React.useRef(0);
+  React.useEffect(() => {
+    if (!scene) {
+      return;
+    }
+    const group = debugGroup.current;
+    group.name = "__physics_debug__";
+    if (debugDraw) {
+      scene.add(group);
+    }
+    return () => {
+      scene.remove(group);
+    };
+  }, [scene, debugDraw]);
+  const setWorldConfig = React.useCallback((partial) => {
+    setWorldConfigState((prev) => ({ ...prev, ...partial }));
+  }, []);
+  const addBody = React.useCallback(
+    (object) => {
+      const id = `phys_${++bodyIdCounter}`;
+      const desc = {
+        id,
+        objectName: object.name || object.uuid,
+        bodyType: "dynamic",
+        colliderShape: inferColliderShape(object),
+        mass: 1,
+        restitution: 0.3,
+        friction: 0.5,
+        linearDamping: 0.01,
+        angularDamping: 0.05,
+        gravityScale: 1,
+        isSensor: false
+      };
+      const internal = {
+        desc,
+        object,
+        velocity: new THREE__namespace.Vector3(),
+        angularVelocity: new THREE__namespace.Vector3(),
+        initialPosition: object.position.clone(),
+        initialRotation: object.quaternion.clone(),
+        initialScale: object.scale.clone()
+      };
+      internalBodies.current.set(id, internal);
+      setBodies((prev) => [...prev, desc]);
+      if (debugDraw) {
+        addDebugCollider(object, desc.colliderShape, id);
+      }
+      return desc;
+    },
+    [debugDraw]
+  );
+  const removeBody = React.useCallback((id) => {
+    internalBodies.current.delete(id);
+    setBodies((prev) => prev.filter((b) => b.id !== id));
+    const debugObj = debugGroup.current.getObjectByName(`debug_${id}`);
+    if (debugObj) {
+      debugGroup.current.remove(debugObj);
+    }
+  }, []);
+  const updateBody = React.useCallback((id, partial) => {
+    const internal = internalBodies.current.get(id);
+    if (internal) {
+      Object.assign(internal.desc, partial);
+    }
+    setBodies((prev) => prev.map((b) => b.id === id ? { ...b, ...partial } : b));
+  }, []);
+  const addJoint = React.useCallback((joint) => {
+    const id = `joint_${++jointIdCounter}`;
+    setJoints((prev) => [...prev, { ...joint, id }]);
+  }, []);
+  const removeJoint = React.useCallback((id) => {
+    setJoints((prev) => prev.filter((j) => j.id !== id));
+  }, []);
+  const getBodyForObject = React.useCallback(
+    (objectName) => bodies.find((b) => b.objectName === objectName),
+    [bodies]
+  );
+  const simulationStep = React.useCallback(
+    (dt) => {
+      const gravity = worldConfig.gravity;
+      internalBodies.current.forEach((body) => {
+        if (body.desc.bodyType !== "dynamic") {
+          return;
         }
-        const group = debugGroup.current;
-        group.name = '__physics_debug__';
-        if (debugDraw) {
-            scene.add(group);
+        body.velocity.addScaledVector(gravity, dt * body.desc.gravityScale);
+        body.velocity.multiplyScalar(1 - body.desc.linearDamping);
+        body.angularVelocity.multiplyScalar(1 - body.desc.angularDamping);
+        body.object.position.addScaledVector(body.velocity, dt);
+        if (body.angularVelocity.lengthSq() > 1e-4) {
+          const q = new THREE__namespace.Quaternion().setFromAxisAngle(
+            body.angularVelocity.clone().normalize(),
+            body.angularVelocity.length() * dt
+          );
+          body.object.quaternion.premultiply(q);
         }
-        return () => {
-            scene.remove(group);
-        };
-    }, [scene, debugDraw]);
-    const setWorldConfig = React.useCallback((partial) => {
-        setWorldConfigState((prev) => ({ ...prev, ...partial }));
-    }, []);
-    const addBody = React.useCallback((object) => {
-        const id = `phys_${++bodyIdCounter}`;
-        const desc = {
-            id,
-            objectName: object.name || object.uuid,
-            bodyType: 'dynamic',
-            colliderShape: inferColliderShape(object),
-            mass: 1,
-            restitution: 0.3,
-            friction: 0.5,
-            linearDamping: 0.01,
-            angularDamping: 0.05,
-            gravityScale: 1,
-            isSensor: false,
-        };
-        const internal = {
-            desc,
-            object,
-            velocity: new THREE__namespace.Vector3(),
-            angularVelocity: new THREE__namespace.Vector3(),
-            initialPosition: object.position.clone(),
-            initialRotation: object.quaternion.clone(),
-            initialScale: object.scale.clone(),
-        };
-        internalBodies.current.set(id, internal);
-        setBodies((prev) => [...prev, desc]);
-        // Add debug wireframe
-        if (debugDraw) {
-            addDebugCollider(object, desc.colliderShape, id);
+        const aabb = computeAABB(body.object);
+        if (aabb.min.y < 0) {
+          body.object.position.y -= aabb.min.y;
+          body.velocity.y = -body.velocity.y * body.desc.restitution;
+          body.velocity.x *= 1 - body.desc.friction * dt;
+          body.velocity.z *= 1 - body.desc.friction * dt;
         }
-        return desc;
-    }, [debugDraw]);
-    const removeBody = React.useCallback((id) => {
-        internalBodies.current.delete(id);
-        setBodies((prev) => prev.filter((b) => b.id !== id));
-        // Remove debug wireframe
-        const debugObj = debugGroup.current.getObjectByName(`debug_${id}`);
+        const debugObj = debugGroup.current.getObjectByName(`debug_${body.desc.id}`);
         if (debugObj) {
-            debugGroup.current.remove(debugObj);
+          debugObj.position.copy(body.object.position);
+          debugObj.quaternion.copy(body.object.quaternion);
         }
-    }, []);
-    const updateBody = React.useCallback((id, partial) => {
-        const internal = internalBodies.current.get(id);
-        if (internal) {
-            Object.assign(internal.desc, partial);
-        }
-        setBodies((prev) => prev.map((b) => (b.id === id ? { ...b, ...partial } : b)));
-    }, []);
-    const addJoint = React.useCallback((joint) => {
-        const id = `joint_${++jointIdCounter}`;
-        setJoints((prev) => [...prev, { ...joint, id }]);
-    }, []);
-    const removeJoint = React.useCallback((id) => {
-        setJoints((prev) => prev.filter((j) => j.id !== id));
-    }, []);
-    const getBodyForObject = React.useCallback((objectName) => bodies.find((b) => b.objectName === objectName), [bodies]);
-    // Simplified physics step (Euler integration with collision detection)
-    const simulationStep = React.useCallback((dt) => {
-        const gravity = worldConfig.gravity;
-        internalBodies.current.forEach((body) => {
-            if (body.desc.bodyType !== 'dynamic') {
-                return;
+      });
+      const dynamicBodies = [...internalBodies.current.values()].filter(
+        (b) => b.desc.bodyType === "dynamic"
+      );
+      for (let i = 0; i < dynamicBodies.length; i++) {
+        for (let j = i + 1; j < dynamicBodies.length; j++) {
+          const a = dynamicBodies[i];
+          const b = dynamicBodies[j];
+          const aabbA = computeAABB(a.object);
+          const aabbB = computeAABB(b.object);
+          if (aabbA.intersectsBox(aabbB)) {
+            const normal = new THREE__namespace.Vector3().subVectors(b.object.position, a.object.position).normalize();
+            const relVel = new THREE__namespace.Vector3().subVectors(a.velocity, b.velocity);
+            const velAlongNormal = relVel.dot(normal);
+            if (velAlongNormal > 0) {
+              continue;
             }
-            // Apply gravity
-            body.velocity.addScaledVector(gravity, dt * body.desc.gravityScale);
-            // Apply damping
-            body.velocity.multiplyScalar(1 - body.desc.linearDamping);
-            body.angularVelocity.multiplyScalar(1 - body.desc.angularDamping);
-            // Integrate position
-            body.object.position.addScaledVector(body.velocity, dt);
-            // Integrate rotation (simplified)
-            if (body.angularVelocity.lengthSq() > 0.0001) {
-                const q = new THREE__namespace.Quaternion().setFromAxisAngle(body.angularVelocity.clone().normalize(), body.angularVelocity.length() * dt);
-                body.object.quaternion.premultiply(q);
+            const restitution = Math.min(a.desc.restitution, b.desc.restitution);
+            const impulseMag = -(1 + restitution) * velAlongNormal / (1 / a.desc.mass + 1 / b.desc.mass);
+            const impulse = normal.clone().multiplyScalar(impulseMag);
+            a.velocity.addScaledVector(impulse, 1 / a.desc.mass);
+            b.velocity.addScaledVector(impulse, -1 / b.desc.mass);
+            const overlap = new THREE__namespace.Vector3();
+            aabbA.intersect(aabbB).getSize(overlap);
+            const sep = Math.min(overlap.x, overlap.y, overlap.z) * 0.5;
+            a.object.position.addScaledVector(normal, -sep);
+            b.object.position.addScaledVector(normal, sep);
+          }
+        }
+      }
+      onSimulationStep?.(dt);
+    },
+    [worldConfig.gravity, onSimulationStep]
+  );
+  React.useEffect(() => {
+    if (!isRunning) {
+      return;
+    }
+    lastTime.current = performance.now();
+    const loop = (now) => {
+      const dt = Math.min(
+        (now - lastTime.current) / 1e3,
+        worldConfig.timestep * worldConfig.maxSubsteps
+      );
+      lastTime.current = now;
+      let accum = dt;
+      while (accum >= worldConfig.timestep) {
+        simulationStep(worldConfig.timestep);
+        accum -= worldConfig.timestep;
+      }
+      animFrameId.current = requestAnimationFrame(loop);
+    };
+    animFrameId.current = requestAnimationFrame(loop);
+    return () => cancelAnimationFrame(animFrameId.current);
+  }, [isRunning, simulationStep, worldConfig.timestep, worldConfig.maxSubsteps]);
+  const play = React.useCallback(() => setIsRunning(true), []);
+  const pause = React.useCallback(() => setIsRunning(false), []);
+  const step = React.useCallback(() => {
+    simulationStep(worldConfig.timestep);
+  }, [simulationStep, worldConfig.timestep]);
+  const reset = React.useCallback(() => {
+    setIsRunning(false);
+    internalBodies.current.forEach((body) => {
+      body.object.position.copy(body.initialPosition);
+      body.object.quaternion.copy(body.initialRotation);
+      body.object.scale.copy(body.initialScale);
+      body.velocity.set(0, 0, 0);
+      body.angularVelocity.set(0, 0, 0);
+    });
+  }, []);
+  function addDebugCollider(object, shape, id) {
+    let geo;
+    const aabb = computeAABB(object);
+    const size = new THREE__namespace.Vector3();
+    aabb.getSize(size);
+    switch (shape) {
+      case "sphere":
+        geo = new THREE__namespace.SphereGeometry(Math.max(size.x, size.y, size.z) / 2, 12, 8);
+        break;
+      case "capsule":
+        geo = new THREE__namespace.CapsuleGeometry(size.x / 2, size.y - size.x, 8, 4);
+        break;
+      default:
+        geo = new THREE__namespace.BoxGeometry(size.x, size.y, size.z);
+    }
+    const wireframe = new THREE__namespace.LineSegments(
+      new THREE__namespace.WireframeGeometry(geo),
+      new THREE__namespace.LineBasicMaterial({ color: 65280, opacity: 0.5, transparent: true })
+    );
+    wireframe.name = `debug_${id}`;
+    wireframe.position.copy(object.position);
+    wireframe.quaternion.copy(object.quaternion);
+    debugGroup.current.add(wireframe);
+  }
+  return {
+    worldConfig,
+    setWorldConfig,
+    bodies,
+    joints,
+    addBody,
+    removeBody,
+    updateBody,
+    addJoint,
+    removeJoint,
+    getBodyForObject,
+    isRunning,
+    play,
+    pause,
+    step,
+    reset,
+    debugDraw,
+    setDebugDraw
+  };
+}
+const NicePhysicsSimulation = ({
+  scene,
+  selectedObject,
+  onSimulationStep,
+  className = ""
+}) => {
+  const { t } = i18n.useNiceTranslation();
+  const {
+    worldConfig,
+    setWorldConfig,
+    bodies,
+    addBody,
+    removeBody,
+    updateBody,
+    getBodyForObject,
+    isRunning,
+    play,
+    pause,
+    step,
+    reset,
+    debugDraw,
+    setDebugDraw
+  } = usePhysicsSimulation(scene, onSimulationStep);
+  const selectedBody = selectedObject ? getBodyForObject(selectedObject.name || selectedObject.uuid) : void 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: `nice-physics-simulation ${className}`,
+      style: { display: "grid", gap: 8, fontSize: 13 },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("strong", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.NiceIcon, { name: "zap", size: 14 }),
+            " ",
+            t("physicsSimulation.physics", "Physics")
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("label", { style: { display: "flex", alignItems: "center", gap: 4, fontSize: 11 }, children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "input",
+              {
+                type: "checkbox",
+                checked: debugDraw,
+                onChange: (e) => setDebugDraw(e.target.checked)
+              }
+            ),
+            t("physicsSimulation.debug", "Debug")
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", gap: 4 }, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "button",
+              onClick: isRunning ? pause : play,
+              style: {
+                flex: 1,
+                background: isRunning ? "var(--nice-danger, #ef4444)" : "var(--nice-success, #22c55e)",
+                color: "var(--nice-color-white, #fff)",
+                border: "none",
+                borderRadius: 4,
+                padding: "5px 8px",
+                cursor: "pointer"
+              },
+              children: isRunning ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx(ui.NiceIcon, { name: "pause", size: 14 }),
+                " ",
+                t("physicsSimulation.pause", "Pause")
+              ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx(ui.NiceIcon, { name: "play", size: 14 }),
+                " ",
+                t("physicsSimulation.play", "Play")
+              ] })
             }
-            // Ground plane collision (y = 0)
-            const aabb = computeAABB(body.object);
-            if (aabb.min.y < 0) {
-                body.object.position.y -= aabb.min.y;
-                body.velocity.y = -body.velocity.y * body.desc.restitution;
-                // Friction on ground
-                body.velocity.x *= 1 - body.desc.friction * dt;
-                body.velocity.z *= 1 - body.desc.friction * dt;
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "button",
+            {
+              type: "button",
+              onClick: step,
+              disabled: isRunning,
+              style: { padding: "5px 8px", cursor: "pointer" },
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(ui.NiceIcon, { name: "skip-forward", size: 14 }),
+                " ",
+                t("physicsSimulation.step", "Step")
+              ]
             }
-            // Update debug wireframe position
-            const debugObj = debugGroup.current.getObjectByName(`debug_${body.desc.id}`);
-            if (debugObj) {
-                debugObj.position.copy(body.object.position);
-                debugObj.quaternion.copy(body.object.quaternion);
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs("button", { type: "button", onClick: reset, style: { padding: "5px 8px", cursor: "pointer" }, children: [
+            /* @__PURE__ */ jsxRuntime.jsx(ui.NiceIcon, { name: "refresh", size: 14 }),
+            " ",
+            t("physicsSimulation.reset", "Reset")
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+          t("physicsSimulation.gravityY", "Gravity Y: {y}").replace(
+            "{y}",
+            String(worldConfig.gravity.y.toFixed(1))
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              type: "range",
+              min: -20,
+              max: 0,
+              step: 0.1,
+              value: worldConfig.gravity.y,
+              onChange: (e) => setWorldConfig({ gravity: new THREE__namespace.Vector3(0, parseFloat(e.target.value), 0) }),
+              style: { width: "100%" }
             }
-        });
-        // AABB body-body collision (simplified)
-        const dynamicBodies = [...internalBodies.current.values()].filter((b) => b.desc.bodyType === 'dynamic');
-        for (let i = 0; i < dynamicBodies.length; i++) {
-            for (let j = i + 1; j < dynamicBodies.length; j++) {
-                const a = dynamicBodies[i];
-                const b = dynamicBodies[j];
-                const aabbA = computeAABB(a.object);
-                const aabbB = computeAABB(b.object);
-                if (aabbA.intersectsBox(aabbB)) {
-                    // Simple elastic collision response
-                    const normal = new THREE__namespace.Vector3()
-                        .subVectors(b.object.position, a.object.position)
-                        .normalize();
-                    const relVel = new THREE__namespace.Vector3().subVectors(a.velocity, b.velocity);
-                    const velAlongNormal = relVel.dot(normal);
-                    if (velAlongNormal > 0) {
-                        continue;
-                    } // separating
-                    const restitution = Math.min(a.desc.restitution, b.desc.restitution);
-                    const impulseMag = (-(1 + restitution) * velAlongNormal) / (1 / a.desc.mass + 1 / b.desc.mass);
-                    const impulse = normal.clone().multiplyScalar(impulseMag);
-                    a.velocity.addScaledVector(impulse, 1 / a.desc.mass);
-                    b.velocity.addScaledVector(impulse, -1 / b.desc.mass);
-                    // Separate overlapping bodies
-                    const overlap = new THREE__namespace.Vector3();
-                    aabbA.intersect(aabbB).getSize(overlap);
-                    const sep = Math.min(overlap.x, overlap.y, overlap.z) * 0.5;
-                    a.object.position.addScaledVector(normal, -sep);
-                    b.object.position.addScaledVector(normal, sep);
+          )
+        ] }),
+        selectedObject && /* @__PURE__ */ jsxRuntime.jsxs(
+          "fieldset",
+          {
+            style: {
+              border: "1px solid var(--nice-border, #e2e8f0)",
+              borderRadius: 6,
+              padding: 6,
+              display: "grid",
+              gap: 4
+            },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("legend", { style: { fontSize: 11 }, children: t("physicsSimulation.objectPhysics", "{name} — Physics").replace(
+                "{name}",
+                selectedObject.name || t("physicsSimulation.object", "Object")
+              ) }),
+              !selectedBody ? /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => addBody(selectedObject),
+                  style: {
+                    background: "var(--nice-color-accent, #6366f1)",
+                    color: "var(--nice-text-on-primary, #fff)",
+                    border: "none",
+                    borderRadius: 4,
+                    padding: "5px 8px",
+                    cursor: "pointer"
+                  },
+                  children: t("physicsSimulation.addRigidBody", "+ Add Rigid Body")
                 }
-            }
-        }
-        onSimulationStep === null || onSimulationStep === void 0 ? void 0 : onSimulationStep(dt);
-    }, [worldConfig.gravity, onSimulationStep]);
-    // Animation loop
-    React.useEffect(() => {
-        if (!isRunning) {
-            return;
-        }
-        lastTime.current = performance.now();
-        const loop = (now) => {
-            const dt = Math.min((now - lastTime.current) / 1000, worldConfig.timestep * worldConfig.maxSubsteps);
-            lastTime.current = now;
-            let accum = dt;
-            while (accum >= worldConfig.timestep) {
-                simulationStep(worldConfig.timestep);
-                accum -= worldConfig.timestep;
-            }
-            animFrameId.current = requestAnimationFrame(loop);
-        };
-        animFrameId.current = requestAnimationFrame(loop);
-        return () => cancelAnimationFrame(animFrameId.current);
-    }, [isRunning, simulationStep, worldConfig.timestep, worldConfig.maxSubsteps]);
-    const play = React.useCallback(() => setIsRunning(true), []);
-    const pause = React.useCallback(() => setIsRunning(false), []);
-    const step = React.useCallback(() => {
-        simulationStep(worldConfig.timestep);
-    }, [simulationStep, worldConfig.timestep]);
-    const reset = React.useCallback(() => {
-        setIsRunning(false);
-        internalBodies.current.forEach((body) => {
-            body.object.position.copy(body.initialPosition);
-            body.object.quaternion.copy(body.initialRotation);
-            body.object.scale.copy(body.initialScale);
-            body.velocity.set(0, 0, 0);
-            body.angularVelocity.set(0, 0, 0);
-        });
-    }, []);
-    function addDebugCollider(object, shape, id) {
-        let geo;
-        const aabb = computeAABB(object);
-        const size = new THREE__namespace.Vector3();
-        aabb.getSize(size);
-        switch (shape) {
-            case 'sphere':
-                geo = new THREE__namespace.SphereGeometry(Math.max(size.x, size.y, size.z) / 2, 12, 8);
-                break;
-            case 'capsule':
-                geo = new THREE__namespace.CapsuleGeometry(size.x / 2, size.y - size.x, 8, 4);
-                break;
-            default:
-                geo = new THREE__namespace.BoxGeometry(size.x, size.y, size.z);
-        }
-        const wireframe = new THREE__namespace.LineSegments(new THREE__namespace.WireframeGeometry(geo), new THREE__namespace.LineBasicMaterial({ color: 0x00ff00, opacity: 0.5, transparent: true }));
-        wireframe.name = `debug_${id}`;
-        wireframe.position.copy(object.position);
-        wireframe.quaternion.copy(object.quaternion);
-        debugGroup.current.add(wireframe);
+              ) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                  t("physicsSimulation.type", "Type:"),
+                  /* @__PURE__ */ jsxRuntime.jsxs(
+                    "select",
+                    {
+                      value: selectedBody.bodyType,
+                      onChange: (e) => updateBody(selectedBody.id, { bodyType: e.target.value }),
+                      style: { marginLeft: 8, width: "100%" },
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsx("option", { value: "dynamic", children: t("physicsSimulation.dynamic", "Dynamic") }),
+                        /* @__PURE__ */ jsxRuntime.jsx("option", { value: "static", children: t("physicsSimulation.static", "Static") }),
+                        /* @__PURE__ */ jsxRuntime.jsx("option", { value: "kinematic", children: t("physicsSimulation.kinematic", "Kinematic") })
+                      ]
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                  t("physicsSimulation.shape", "Shape:"),
+                  /* @__PURE__ */ jsxRuntime.jsxs(
+                    "select",
+                    {
+                      value: selectedBody.colliderShape,
+                      onChange: (e) => updateBody(selectedBody.id, { colliderShape: e.target.value }),
+                      style: { marginLeft: 8, width: "100%" },
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsx("option", { value: "box", children: t("physicsSimulation.box", "Box") }),
+                        /* @__PURE__ */ jsxRuntime.jsx("option", { value: "sphere", children: t("physicsSimulation.sphere", "Sphere") }),
+                        /* @__PURE__ */ jsxRuntime.jsx("option", { value: "capsule", children: t("physicsSimulation.capsule", "Capsule") }),
+                        /* @__PURE__ */ jsxRuntime.jsx("option", { value: "convexHull", children: t("physicsSimulation.convexHull", "Convex Hull") }),
+                        /* @__PURE__ */ jsxRuntime.jsx("option", { value: "trimesh", children: t("physicsSimulation.trimesh", "Trimesh") })
+                      ]
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                  t("physicsSimulation.mass", "Mass: {mass}").replace(
+                    "{mass}",
+                    String(selectedBody.mass.toFixed(1))
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "input",
+                    {
+                      type: "range",
+                      min: 0.1,
+                      max: 100,
+                      step: 0.1,
+                      value: selectedBody.mass,
+                      onChange: (e) => updateBody(selectedBody.id, { mass: parseFloat(e.target.value) }),
+                      style: { width: "100%" }
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                  t("physicsSimulation.restitution", "Restitution: {restitution}").replace(
+                    "{restitution}",
+                    String(selectedBody.restitution.toFixed(2))
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "input",
+                    {
+                      type: "range",
+                      min: 0,
+                      max: 1,
+                      step: 0.01,
+                      value: selectedBody.restitution,
+                      onChange: (e) => updateBody(selectedBody.id, { restitution: parseFloat(e.target.value) }),
+                      style: { width: "100%" }
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs("label", { children: [
+                  t("physicsSimulation.friction", "Friction: {friction}").replace(
+                    "{friction}",
+                    String(selectedBody.friction.toFixed(2))
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "input",
+                    {
+                      type: "range",
+                      min: 0,
+                      max: 1,
+                      step: 0.01,
+                      value: selectedBody.friction,
+                      onChange: (e) => updateBody(selectedBody.id, { friction: parseFloat(e.target.value) }),
+                      style: { width: "100%" }
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs("label", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "input",
+                    {
+                      type: "checkbox",
+                      checked: selectedBody.isSensor,
+                      onChange: (e) => updateBody(selectedBody.id, { isSensor: e.target.checked })
+                    }
+                  ),
+                  t("physicsSimulation.sensorTriggerOnly", "Sensor (trigger only)")
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => removeBody(selectedBody.id),
+                    style: {
+                      background: "var(--nice-danger, #ef4444)",
+                      color: "var(--nice-text-on-primary, #fff)",
+                      border: "none",
+                      borderRadius: 4,
+                      padding: "4px 8px",
+                      cursor: "pointer",
+                      fontSize: 11
+                    },
+                    children: t("physicsSimulation.removeRigidBody", "Remove Rigid Body")
+                  }
+                )
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 11, opacity: 0.7 }, children: t("physicsSimulation.totalBodies", "Total bodies: {bodies}").replace(
+          "{bodies}",
+          String(bodies.length)
+        ) })
+      ]
     }
-    return {
-        worldConfig,
-        setWorldConfig,
-        bodies,
-        joints,
-        addBody,
-        removeBody,
-        updateBody,
-        addJoint,
-        removeJoint,
-        getBodyForObject,
-        isRunning,
-        play,
-        pause,
-        step,
-        reset,
-        debugDraw,
-        setDebugDraw,
-    };
-}
-/* ── Component ── */
-const NicePhysicsSimulation = ({ scene, selectedObject, onSimulationStep, className = '', }) => {
-    const { t } = i18n.useNiceTranslation();
-    const { worldConfig, setWorldConfig, bodies, addBody, removeBody, updateBody, getBodyForObject, isRunning, play, pause, step, reset, debugDraw, setDebugDraw, } = usePhysicsSimulation(scene, onSimulationStep);
-    const selectedBody = selectedObject
-        ? getBodyForObject(selectedObject.name || selectedObject.uuid)
-        : undefined;
-    return (jsxRuntime.jsxs("div", { className: `nice-physics-simulation ${className}`, style: { display: 'grid', gap: 8, fontSize: 13 }, children: [jsxRuntime.jsxs("div", { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center' }, children: [jsxRuntime.jsxs("strong", { children: [jsxRuntime.jsx(ui.NiceIcon, { name: "zap", size: 14 }), " ", t('physicsSimulation.physics', 'Physics')] }), jsxRuntime.jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 4, fontSize: 11 }, children: [jsxRuntime.jsx("input", { type: "checkbox", checked: debugDraw, onChange: (e) => setDebugDraw(e.target.checked) }), t('physicsSimulation.debug', 'Debug')] })] }), jsxRuntime.jsxs("div", { style: { display: 'flex', gap: 4 }, children: [jsxRuntime.jsx("button", { type: "button", onClick: isRunning ? pause : play, style: {
-                            flex: 1,
-                            background: isRunning ? 'var(--nice-danger, #ef4444)' : 'var(--nice-success, #22c55e)',
-                            color: 'var(--nice-color-white, #fff)',
-                            border: 'none',
-                            borderRadius: 4,
-                            padding: '5px 8px',
-                            cursor: 'pointer',
-                        }, children: isRunning ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ui.NiceIcon, { name: "pause", size: 14 }), " ", t('physicsSimulation.pause', 'Pause')] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ui.NiceIcon, { name: "play", size: 14 }), " ", t('physicsSimulation.play', 'Play')] })) }), jsxRuntime.jsxs("button", { type: "button", onClick: step, disabled: isRunning, style: { padding: '5px 8px', cursor: 'pointer' }, children: [jsxRuntime.jsx(ui.NiceIcon, { name: "skip-forward", size: 14 }), " ", t('physicsSimulation.step', 'Step')] }), jsxRuntime.jsxs("button", { type: "button", onClick: reset, style: { padding: '5px 8px', cursor: 'pointer' }, children: [jsxRuntime.jsx(ui.NiceIcon, { name: "refresh", size: 14 }), " ", t('physicsSimulation.reset', 'Reset')] })] }), jsxRuntime.jsxs("label", { children: [t('physicsSimulation.gravityY', 'Gravity Y: {y}').replace('{y}', String(worldConfig.gravity.y.toFixed(1))), jsxRuntime.jsx("input", { type: "range", min: -20, max: 0, step: 0.1, value: worldConfig.gravity.y, onChange: (e) => setWorldConfig({ gravity: new THREE__namespace.Vector3(0, parseFloat(e.target.value), 0) }), style: { width: '100%' } })] }), selectedObject && (jsxRuntime.jsxs("fieldset", { style: {
-                    border: '1px solid var(--nice-border, #e2e8f0)',
-                    borderRadius: 6,
-                    padding: 6,
-                    display: 'grid',
-                    gap: 4,
-                }, children: [jsxRuntime.jsx("legend", { style: { fontSize: 11 }, children: t('physicsSimulation.objectPhysics', '{name} — Physics').replace('{name}', selectedObject.name || t('physicsSimulation.object', 'Object')) }), !selectedBody ? (jsxRuntime.jsx("button", { type: "button", onClick: () => addBody(selectedObject), style: {
-                            background: 'var(--nice-color-accent, #6366f1)',
-                            color: 'var(--nice-text-on-primary, #fff)',
-                            border: 'none',
-                            borderRadius: 4,
-                            padding: '5px 8px',
-                            cursor: 'pointer',
-                        }, children: t('physicsSimulation.addRigidBody', '+ Add Rigid Body') })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("label", { children: [t('physicsSimulation.type', 'Type:'), jsxRuntime.jsxs("select", { value: selectedBody.bodyType, onChange: (e) => updateBody(selectedBody.id, { bodyType: e.target.value }), style: { marginLeft: 8, width: '100%' }, children: [jsxRuntime.jsx("option", { value: "dynamic", children: t('physicsSimulation.dynamic', 'Dynamic') }), jsxRuntime.jsx("option", { value: "static", children: t('physicsSimulation.static', 'Static') }), jsxRuntime.jsx("option", { value: "kinematic", children: t('physicsSimulation.kinematic', 'Kinematic') })] })] }), jsxRuntime.jsxs("label", { children: [t('physicsSimulation.shape', 'Shape:'), jsxRuntime.jsxs("select", { value: selectedBody.colliderShape, onChange: (e) => updateBody(selectedBody.id, { colliderShape: e.target.value }), style: { marginLeft: 8, width: '100%' }, children: [jsxRuntime.jsx("option", { value: "box", children: t('physicsSimulation.box', 'Box') }), jsxRuntime.jsx("option", { value: "sphere", children: t('physicsSimulation.sphere', 'Sphere') }), jsxRuntime.jsx("option", { value: "capsule", children: t('physicsSimulation.capsule', 'Capsule') }), jsxRuntime.jsx("option", { value: "convexHull", children: t('physicsSimulation.convexHull', 'Convex Hull') }), jsxRuntime.jsx("option", { value: "trimesh", children: t('physicsSimulation.trimesh', 'Trimesh') })] })] }), jsxRuntime.jsxs("label", { children: [t('physicsSimulation.mass', 'Mass: {mass}').replace('{mass}', String(selectedBody.mass.toFixed(1))), jsxRuntime.jsx("input", { type: "range", min: 0.1, max: 100, step: 0.1, value: selectedBody.mass, onChange: (e) => updateBody(selectedBody.id, { mass: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxRuntime.jsxs("label", { children: [t('physicsSimulation.restitution', 'Restitution: {restitution}').replace('{restitution}', String(selectedBody.restitution.toFixed(2))), jsxRuntime.jsx("input", { type: "range", min: 0, max: 1, step: 0.01, value: selectedBody.restitution, onChange: (e) => updateBody(selectedBody.id, { restitution: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxRuntime.jsxs("label", { children: [t('physicsSimulation.friction', 'Friction: {friction}').replace('{friction}', String(selectedBody.friction.toFixed(2))), jsxRuntime.jsx("input", { type: "range", min: 0, max: 1, step: 0.01, value: selectedBody.friction, onChange: (e) => updateBody(selectedBody.id, { friction: parseFloat(e.target.value) }), style: { width: '100%' } })] }), jsxRuntime.jsxs("label", { style: { display: 'flex', alignItems: 'center', gap: 6 }, children: [jsxRuntime.jsx("input", { type: "checkbox", checked: selectedBody.isSensor, onChange: (e) => updateBody(selectedBody.id, { isSensor: e.target.checked }) }), t('physicsSimulation.sensorTriggerOnly', 'Sensor (trigger only)')] }), jsxRuntime.jsx("button", { type: "button", onClick: () => removeBody(selectedBody.id), style: {
-                                    background: 'var(--nice-danger, #ef4444)',
-                                    color: 'var(--nice-text-on-primary, #fff)',
-                                    border: 'none',
-                                    borderRadius: 4,
-                                    padding: '4px 8px',
-                                    cursor: 'pointer',
-                                    fontSize: 11,
-                                }, children: t('physicsSimulation.removeRigidBody', 'Remove Rigid Body') })] }))] })), jsxRuntime.jsx("div", { style: { fontSize: 11, opacity: 0.7 }, children: t('physicsSimulation.totalBodies', 'Total bodies: {bodies}').replace('{bodies}', String(bodies.length)) })] }));
+  );
 };
-
 exports.NicePhysicsSimulation = NicePhysicsSimulation;
 exports.usePhysicsSimulation = usePhysicsSimulation;