fix(editor): restore stable map editing behavior

src/hooks/three/useClonedObject.ts

@@ -1,6 +1,30 @@
-import { useMemo } from "react";
+import { useEffect, useMemo } from "react";
 import * as THREE from "three";
+import { disposeObject3D } from "@/utils/three/dispose";
+
+function cloneObjectWithOwnedResources<T extends THREE.Object3D>(object: T): T {
+  const clone = object.clone(true) as T;
+
+  clone.traverse((child) => {
+    if (!(child instanceof THREE.Mesh)) return;
+
+    child.geometry = child.geometry.clone();
+    child.material = Array.isArray(child.material)
+      ? child.material.map((material) => material.clone())
+      : child.material.clone();
+  });
+
+  return clone;
+}
 
 export function useClonedObject<T extends THREE.Object3D>(object: T): T {
-  return useMemo(() => object.clone(true) as T, [object]);
+  const clone = useMemo(() => cloneObjectWithOwnedResources(object), [object]);
+
+  useEffect(() => {
+    return () => {
+      disposeObject3D(clone);
+    };
+  }, [clone]);
+
+  return clone;
 }