diff --git a/docs/getting-started/introduction.md b/docs/getting-started/introduction.md index dcab5a2..68a34cc 100644 --- a/docs/getting-started/introduction.md +++ b/docs/getting-started/introduction.md @@ -47,7 +47,8 @@ export function App() { ## Tutorials - 💾 [Store](../tutorials/store.md) -- 👌 [Interactions](../tutorials/interactions.md) +- 👆 [Interactions](../tutorials/interactions.md) +- 👌 [Handles](../handles/introduction.md) - 🧊 [Object Detection](../tutorials/object-detection.md) - ✴ [Origin](../tutorials/origin.md) - 🪄 [Teleport](../tutorials/teleport.md) @@ -60,13 +61,14 @@ export function App() { - 🎯 [Hit Test](../tutorials/hit-test.md) - ⛨ [Guards](../tutorials/guards.md) +## External Tutorials + +- 🥇 [**WebXR First Steps React** by Meta Quest](https://github.com/meta-quest/webxr-first-steps-react) + ## Roadmap - 🤳 XR Gestures -- ➕ Multimodal -- 📺 Layers - 🕺 Tracked Body -- ↕ react-three/controls ## Migration guides diff --git a/docs/tutorials/interactions.md b/docs/tutorials/interactions.md index 5cb4b6b..66ae443 100644 --- a/docs/tutorials/interactions.md +++ b/docs/tutorials/interactions.md @@ -4,6 +4,8 @@ description: Build interactions that work across XR and non-XR web applications nav: 9 --- +On this page, you can learn the basics behind pointer events and interactions in react-three/xr. From experience, we found that many people are interested in more high level interactions, which can be build with the concept of handles. Check out the [handles pages](../handles/introduction.md) to learn more about the concept and the library we built for it. + @react-three/xr uses the same pointer events as @react-three/fiber, which allows building interactions that work on non-XR devices as well as XR devices. So, just like you'd expect from @react-three/fiber and everywhere else in react, interactions are built using - `onPointerMove`