🚀 Auto-deploy: melhoria no snap e medição AR em 04/08/2026 20:11:57

src/lab/QuestCubeLab.tsx

@@ -7,6 +7,7 @@ import {
   Environment,
   PerspectiveCamera,
 } from "@react-three/drei";
+import { XR, createXRStore } from "@react-three/xr";
 import * as THREE from "three";
 import {
   Beaker,
@@ -38,6 +39,10 @@ const CUBE_SIZE = 1;
 
 type AlignPhase = 'IDLE' | 'WAIT_SURFACE' | 'WAIT_FACE2' | 'WAIT_EDGE';
 
+const store = createXRStore({
+  controller: { left: true, right: true },
+});
+
 // ===================================================================
 // COMPONENTE: CuboControlado
 // ===================================================================
@@ -274,16 +279,8 @@ const QuestCubeLab = () => {
     setAlignPhase('IDLE');
   };
 
-  const enterXR = async () => {
-    try {
-      const xr = (navigator as Navigator & { xr?: { requestSession: (mode: string) => Promise<unknown> } })?.xr;
-      if (!xr) return;
-      const session = await xr.requestSession("immersive-ar");
-      void session;
-      alert("XR session requisitada.");
-    } catch (e) {
-      alert("Falha ao entrar em XR: " + (e as Error).message);
-    }
+  const enterXR = () => {
+    store.enterAR();
   };
 
   const handleSurfaceClick = (point: THREE.Vector3, normal: THREE.Vector3) => {
@@ -415,6 +412,7 @@ const QuestCubeLab = () => {
 
           <div style={{ height: 600 }}>
             <Canvas shadows>
+              <XR store={store}>
                 <PerspectiveCamera makeDefault position={[3, 4, 6]} fov={50} />
                 <ambientLight intensity={0.5} />
                 <directionalLight position={[5, 8, 5]} intensity={1} castShadow shadow-mapSize-width={1024} shadow-mapSize-height={1024} />
@@ -443,6 +441,7 @@ const QuestCubeLab = () => {
                 </mesh>
                 <OrbitControls makeDefault enableDamping />
                 <Environment preset="city" />
+              </XR>
             </Canvas>
           </div>