\r\n ```\r\n4. The camera should zoom on drag when left mouse button is pressed, but instead the camera rotates (default behavior)\r\n\r\n_Note:_ The same applies to `touches` as both of the props are discarded when turning props into refs, and aren't passed down to the extended component: https://github.com/Tresjs/cientos/blob/main/src/core/controls/CameraControls.vue#L331C1-L357C18\r\n\r\nI prepared a fix for that, will submit a PR shortly 😉 \r\n\n\n### System Info\n\n```shell\nSystem:\r\n OS: macOS 14.4.1\r\n CPU: (8) arm64 Apple M1 Pro\r\n Memory: 4.18 GB / 32.00 GB\r\n Shell: 5.9 - /bin/zsh\r\n Binaries:\r\n Node: 20.11.1 - ~/.nvm/versions/node/v20.11.1/bin/node\r\n npm: 10.2.4 - ~/.nvm/versions/node/v20.11.1/bin/npm\r\n pnpm: 8.15.4 - ~/Library/pnpm/pnpm\r\n bun: 1.0.27 - ~/.bun/bin/bun\r\n Browsers:\r\n Chrome: 124.0.6367.61\r\n Safari: 17.4.1\r\n npmPackages:\r\n @tresjs/cientos: ^3.8.0 => 3.8.0 \r\n @tresjs/core: ^3.8.1 => 3.8.1 \r\n @tresjs/leches: ^0.14.0 => 0.14.0 \r\n @tresjs/post-processing: ^0.7.1 => 0.7.1 \r\n vite: ^5.1.5 => 5.1.6\n```\n\n\n### Used Package Manager\n\nnpm\n\n### Code of Conduct\n\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/cientos/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/cientos/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://cientos.tresjs.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/Tresjs/cientos/issues) that reports the same bug to avoid creating a duplicate.\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[],384,"cientos","CameraControls component doesn't support mouseButtons and touches props","2024-04-22T19:21:04Z","https://github.com/Tresjs/cientos/issues/384",0.77950644,{"description":3081,"labels":3082,"number":3091,"owner":3024,"repository":3065,"state":3066,"title":3092,"updated_at":3093,"url":3094,"score":3095},"### Description\n\nAs a developer using TresJS, I would like to have an Event Management solution with the following features:\r\n\r\n- Support for:\r\n - onClick\r\n - onContextMenu (rightClick)\r\n - onDoubleClick\r\n - onWheel\r\n - onPointerDown\r\n - onPointerUp\r\n - onPointerLeave\r\n - onPointerMove\r\n - onPointerCancel\r\n - onLostPointerCapture\r\n- Event prioritization \r\n- primitive pointer events\r\n- Event bubbling and propagation #501 #426 \r\n\r\n# Propagation through intersected objects\r\n\r\nRaycasting-Based Interaction: Tres should use Three.js's raycasting to determine which objects are interacted with. A ray is cast from the camera through the mouse position into the 3D space, and intersections with objects are calculated.\r\n\r\nSimulated Bubbling: When an event occurs, Tres might propagate it through objects based on their spatial arrangement (like from child to parent), but this is based on the raycast hits and not a strict parent-child hierarchy as in the DOM.\r\n\r\nMeaning that stop propagation is based on occlusion\r\n\r\n\r\n\r\nIf the object is a Group or a model consistent with several meshes, the same concept applies, the closest mesh to the camera stops the propagation\r\n\r\n\r\n\n\n### Suggested solution\n\n# Current solution uses:\r\n\r\n- `useRaycaster` https://github.com/Tresjs/tres/blob/main/src/composables/useRaycaster/index.ts\r\n- `usePointerEventHandler` https://github.com/Tresjs/tres/tree/main/src/composables/usePointerEventHandler\r\n\r\nRegister of events is being done here \r\nhttps://github.com/Tresjs/tres/blob/main/src/composables/usePointerEventHandler/index.ts#L57-L62\r\n\r\n```ts\r\nconst registerObject = (object: Object3D & EventProps) => {\r\n const { onClick, onPointerMove, onPointerEnter, onPointerLeave } = object\r\n\r\n if (onClick) objectsWithEventListeners.click.set(object, onClick)\r\n if (onPointerMove) objectsWithEventListeners.pointerMove.set(object, onPointerMove)\r\n if (onPointerEnter) objectsWithEventListeners.pointerEnter.set(object, onPointerEnter)\r\n if (onPointerLeave) objectsWithEventListeners.pointerLeave.set(object, onPointerLeave)\r\n}\r\n\r\n // to make the registerObject available in the custom renderer (nodeOps), it is attached to the scene\r\n scene.userData.tres__registerAtPointerEventHandler = registerObject\r\n scene.userData.tres__deregisterAtPointerEventHandler = deregisterObject\r\n\r\n scene.userData.tres__registerBlockingObjectAtPointerEventHandler = registerBlockingObject\r\n scene.userData.tres__deregisterBlockingObjectAtPointerEventHandler = deregisterBlockingObject\r\n```\r\n\r\nThese are then used on the renderer by saving them on the `userData` of the scene object\r\n\r\n```ts\r\ninsert(child, parent) {\r\n if (parent && parent.isScene) scene = parent as unknown as TresScene\r\n\r\n const parentObject = parent || scene\r\n\r\n if (child?.isObject3D) {\r\n if (\r\n child && supportedPointerEvents.some(eventName => child[eventName])\r\n ) {\r\n if (!scene?.userData.tres__registerAtPointerEventHandler)\r\n throw 'could not find tres__registerAtPointerEventHandler on scene\\'s userData'\r\n\r\n scene?.userData.tres__registerAtPointerEventHandler?.(child as Object3D)\r\n }\r\n }\r\n```\r\n\r\nhttps://github.com/Tresjs/tres/blob/main/src/core/nodeOps.ts#L102\r\n\r\n# Desired solution\r\n\r\nA state/store to manage the events\r\n\n\n### Alternative\n\n_No response_\n\n### Additional context\n\n_No response_\n\n### Validations\n\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/tres/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/tres/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://tresjs.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/tresjs/tres/issues) that reports the same bug to avoid creating a duplicate.",[3083,3084,3087,3088],{"name":3056,"color":3057},{"name":3085,"color":3086},"v4","7980EA",{"name":3036,"color":3037},{"name":3089,"color":3090},"breaking-change","5612D2",515,"Pointer EventManager state","2024-05-30T06:32:45Z","https://github.com/Tresjs/tres/issues/515",0.7957962,{"description":3097,"labels":3098,"number":93,"owner":3024,"repository":3075,"state":3066,"title":3099,"updated_at":3100,"url":3101,"score":3102},"**Is your feature request related to a problem? Please describe.**\r\nWe should have a [CameraControls](https://github.com/yomotsu/camera-controls) component as it is a very handy tool.\r\n\r\n**Describe the solution you'd like**\r\nAbstraction in cientos.\r\n\r\n**Suggested solution**\r\nSee [drei](https://github.com/pmndrs/drei).\r\n",[],"CameraControls in cientos","2023-07-26T13:40:26Z","https://github.com/Tresjs/cientos/issues/1",0.7985352,{"description":3104,"labels":3105,"number":93,"owner":3024,"repository":3106,"state":3066,"title":3107,"updated_at":3108,"url":3109,"score":3102},"When i run 'pnpm dev' locally, i get this error:\r\n\r\n\r\n\r\nI guess maybe **node version** cause? I checked the node version, and It's **16.19.0**. Ok, I change it to **18.14.0**. Yes,it works! Then , I change it to **17.9.1**, the error again. \r\n\r\nAdd something about **node version** in README? ",[],"lab","'pnpm dev' failed","2024-09-01T16:08:35Z","https://github.com/Tresjs/lab/issues/1",{"description":3111,"labels":3112,"number":3119,"owner":3024,"repository":3065,"state":3066,"title":3120,"updated_at":3121,"url":3122,"score":3123},"### Description\n\n### Hola 👋 \r\n\r\nThere is MindAr.\r\nMindAr is a threeJS libary for image tracking and other AR Features.\r\n\r\n**Is it possible to integrate it?**\r\n\r\nNot too familar with TresJs So far, but maybe with some help. \r\nI can skretch something out to make a tiny AR Expierience. \r\nDoes someone with more expierience can take a look and some ideas of how to implent it in a really rough way? ^ ^ \r\n\r\n### Best Regards\n\n### Suggested solution\n\n[React Three Fiber and mindAR integration](https://github.com/tommasoturchi/react-three-mind)\r\n\r\n[MindAR - Repo ](https://github.com/hiukim/mind-ar-js)\r\n\n\n### Alternative\n\n_No response_\n\n### Additional context\n\n_No response_\n\n### Validations\n\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/tres/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/tres/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://tresjs.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/tresjs/tres/issues) that reports the same bug to avoid creating a duplicate.",[3113,3116],{"name":3114,"color":3115},"wontfix","ffffff",{"name":3117,"color":3118},"community","DC9921",421,"MindAR","2024-08-21T10:44:15Z","https://github.com/Tresjs/tres/issues/421",0.79957783,{"description":3125,"labels":3126,"number":104,"owner":3024,"repository":3065,"state":3066,"title":3131,"updated_at":3132,"url":3133,"score":3134},"Something similar to \r\n\r\n- [x] Transform Controls https://github.com/pmndrs/drei#pivotcontrols\r\n- [x] Make default",[3127,3130],{"name":3128,"color":3129},"good first issue","7057ff",{"name":3056,"color":3057},"Transform Controls","2022-12-30T15:13:38Z","https://github.com/Tresjs/tres/issues/3",0.8038134,["Reactive",3136],{},["Set"],["ShallowReactive",3139],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fkomeB5Yvm4uf66y5E1vdzMS934cf4CfzBZoJBe0Qxss":-1},"/Tresjs/XR/14"]