\r\n \u003CTresCanvas v-bind=\"gl\">\r\n \u003CTresPerspectiveCamera :position=\"[5, 5, 5]\" />\r\n \u003CCameraControls\r\n v-bind=\"controlsState\"\r\n ref=\"controlsRef\"\r\n :make-default=\"makeDefault\"\r\n @change=\"onChange\"\r\n @start=\"onStart\"\r\n @end=\"onEnd\"\r\n />\r\n \r\n```\r\n \r\n \r\nThat means every time these emits would be expected to fire once, they're fired 100 times:\r\n\r\n```\r\nfunction addEventListeners() {\r\n useEventListener(controlsRef.value as any, 'update', () => {\r\n emit('change', controlsRef.value)\r\n invalidateOnDemand()\r\n })\r\n useEventListener(controlsRef.value as any, 'controlend', () => emit('end', controlsRef.value))\r\n useEventListener(controlsRef.value as any, 'controlstart', () => emit('start', controlsRef.value))\r\n}\r\n```\r\n\r\nThe problem is the anonymous functions:\r\n\r\nNote: If a particular anonymous function is in the list of event listeners registered for a certain target, and then later in the code, an identical anonymous function is given in an addEventListener call, the second function will also be added to the list of event listeners for that target.\r\n\r\nIndeed, anonymous functions are not identical even if defined using the same unchanging source-code called repeatedly, even if in a loop.\r\n\r\nRepeatedly defining the same unnamed function in such cases can be problematic. (See Memory issues, below.)\r\n\r\nhttps://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener\r\nMDN Web Docs\r\n[EventTarget: addEventListener() method - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener)\r\nThe addEventListener() method of the EventTarget interface\r\nsets up a function that will be called whenever the specified event is delivered to the target.\r\n\r\n### Reproduction\r\n\r\nN/A\r\n\r\n### Steps to reproduce\r\n\r\n_No response_\r\n\r\n### System Info\r\n\r\n_No response_\r\n\r\n### Used Package Manager\r\n\r\nnpm\r\n\r\n### Code of Conduct\r\n\r\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/cientos/blob/main/CODE_OF_CONDUCT.md)\r\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/cientos/blob/main/CONTRIBUTING.md).\r\n- [X] Read the [docs](https://cientos.tresjs.org/guide).\r\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.\r\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[2905,2906],{"name":2894,"color":2895},{"name":2907,"color":2908},"p3-minor-bug","F28C37",457,"cientos","useEventListener bug in controls","2024-07-24T06:42:25Z","https://github.com/Tresjs/cientos/issues/457",0.76826656,{"description":2916,"labels":2917,"number":2924,"owner":2872,"repository":2873,"state":2874,"title":2925,"updated_at":2926,"url":2927,"score":2928},"### Description\n\nAs a developer using Tres I would like to have an easy and fast way to add or remove layers to my instances.\r\n\r\n\n\n### Suggested solution\n\nMy suggestion is something like:\r\n\r\n\u003CTresMesh v-layer:enable=\"1\" />\r\n\r\nWe should accept an array too\r\n\u003CTresMesh v-layer:enable=\"[1, 2, 3]\" />\r\n\r\nAnd of course other methods like: disable, test (maybe with a console.log), toggle\r\n\r\nFor more info, check:\r\nhttps://threejs.org/docs/index.html?q=layers#api/en/core/Layers\r\n\n\n### Alternative\n\nAny other alternative is considered\n\n### Additional context\n\nAs we discuss, you can achieve this by using template ref, but sometimes is just too much code, this Issue will could improve the UX\r\n\r\nFollowing the directives pattern (to make our user easier)\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.",[2918,2921],{"name":2919,"color":2920},"feature","c2e0c6",{"name":2922,"color":2923},"p2-nice-to-have","D4C5F9",543,"v-layer directive","2024-03-30T15:32:13Z","https://github.com/Tresjs/tres/issues/543",0.76981133,{"description":2930,"labels":2931,"number":2932,"owner":2872,"repository":2910,"state":2874,"title":2933,"updated_at":2934,"url":2935,"score":2936},"### Describe the bug\n\nFollow up for this [Discussion](https://github.com/orgs/Tresjs/discussions/755).\r\n\r\ntl;dr: I tried extending Trackball Controls according to the documentation for extending Orbit Controls, however it didn't work. Confirmed to be a bug with Cientos, so I made this issue.\n\n### Reproduction\n\nhttps://stackblitz.com/edit/tresjs-minimal-reproduction-vev5jt?file=src%2Fcomponents%2FTheExperience.vue\n\n### Steps to reproduce\n\nExtend trackball controls like how you would with orbit controls as mentioned in the TresJS docs\n\n### System Info\n\n```shell\nSystem:\r\n OS: Linux 5.0 undefined\r\n CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz\r\n Memory: 0 Bytes / 0 Bytes\r\n Shell: 1.0 - /bin/jsh\r\n Binaries:\r\n Node: 18.20.3 - /usr/local/bin/node\r\n Yarn: 1.22.19 - /usr/local/bin/yarn\r\n npm: 10.2.3 - /usr/local/bin/npm\r\n pnpm: 8.15.6 - /usr/local/bin/pnpm\r\n npmPackages:\r\n @tresjs/cientos: 3.9.0 => 3.9.0 \r\n @tresjs/core: 4.0.2 => 4.0.2 \r\n vite: ^5.3.2 => 5.3.2\n```\n\n\n### Used Package Manager\n\npnpm\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.",[],453,"Trackball Controls not extending properly","2024-09-03T13:00:59Z","https://github.com/Tresjs/cientos/issues/453",0.7717694,{"description":2938,"labels":2939,"number":2944,"owner":2872,"repository":2910,"state":2874,"title":2945,"updated_at":2946,"url":2947,"score":2948},"### Description\r\n\r\nAs a dev using TresJS, I would like to have an abstraction for [Drag Controls](https://threejs.org/docs/#examples/en/controls/DragControls)\r\n\r\n\r\n\r\n### Suggested solution\r\n\r\nSimilar to https://github.com/pmndrs/drei?tab=readme-ov-file#dragcontrols\r\nhttps://threejs.org/examples/?q=drag#misc_controls_drag\r\n\r\n\r\n### Alternative\r\n\r\n_No response_\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Validations\r\n\r\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/cientos/blob/main/CODE_OF_CONDUCT.md)\r\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/cientos/blob/main/CONTRIBUTING.md).\r\n- [X] Read the [docs](https://cientos.tresjs.org/guide).\r\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.",[2940,2941],{"name":2919,"color":2920},{"name":2942,"color":2943},"p3-significant","2C78E3",455,"Drag Controls","2024-11-27T10:47:00Z","https://github.com/Tresjs/cientos/issues/455",0.77394915,{"description":2950,"labels":2951,"number":2958,"owner":2872,"repository":2873,"state":2874,"title":2959,"updated_at":2960,"url":2961,"score":2962},"### Description\n\nDocs need a little bit of caring for v4\r\nSame for playgrounds\n\n### Suggested solution\n\n- [ ] Remove playground section on https://docs.tresjs.org/guide/#playground\r\n- [x] Remove basic demos from playground https://playground.tresjs.org/\r\n- [ ] Move Events demo from playground to docs (use sandbox)\r\n- [ ] Change naming sandbox to playground\r\n- [ ] Playground is gonna be Showcase/MadeWithTres\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.",[2952,2955],{"name":2953,"color":2954},"docs","0075ca",{"name":2956,"color":2957},"v4","7980EA",494,"Improvements Docs","2024-03-28T11:19:18Z","https://github.com/Tresjs/tres/issues/494",0.7748882,{"description":2964,"labels":2965,"number":2966,"owner":2872,"repository":2873,"state":2967,"title":2968,"updated_at":2969,"url":2970,"score":2971},"### Describe the bug\n\nI recently found this lib and find it awesome so far! Unfortunately, while I was experimenting with the `TresDirectionalLight` I realised there is an exception thrown when passing `:shadow-map-size-width` or `:shadow-map-size-height` attrs to the component, which seems to work fine in the examples (probably something changed overtime).\r\nThe root cause as I can see, comes from `[tres/src/core/nodeOps.ts].patchProp`, which tries to retrieve an inner object prop, based on the attribute name. The problem with `shadow-map-size-height` comes from the fact it must be transpiled into `shadow.mapSize.height`, where the selector becomes `shadow.map.size.height`.\r\n\r\nAs a temporary solution, I use v-bind on the component attached to object as follows:\r\n```\r\nconst shadowConfig = {\r\n 'shadow-mapSize-width': 512,\r\n 'shadow-mapSize-height': 512\r\n}\r\n```\n\n### Reproduction\n\nhttps://stackblitz.com/edit/tresjs-basic-yslayw\n\n### Steps to reproduce\n\nnpm intall && npm run dev\r\nerror is being logged in the inspector :/\n\n### System Info\n\n_No response_\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/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.\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[],445,"closed","[Cannot read properties of null (reading 'size')] patchProp does not properly handle camelCase props","2023-11-28T13:27:55Z","https://github.com/Tresjs/tres/issues/445",0.73759204,{"description":2973,"labels":2974,"number":2978,"owner":2872,"repository":2873,"state":2967,"title":2979,"updated_at":2980,"url":2981,"score":2982},"### Describe the bug\n\nPointer events on `\u003CTresGroup>` are not working, clicking on the children should trigger a click event\r\n\n\n### Reproduction\n\nhttps://stackblitz.com/edit/tresjs-basic-bivxri?file=README.md,src%2Fcomponents%2FTheExperience.vue\n\n### Steps to reproduce\n\nAdd a pointer event to a `\u003CTresGroup>` \n\n### System Info\n\n```shell\nSystem:\r\n OS: Linux 5.0 undefined\r\n CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz\r\n Memory: 0 Bytes / 0 Bytes\r\n Shell: 1.0 - /bin/jsh\r\n Binaries:\r\n Node: 18.18.0 - /usr/local/bin/node\r\n Yarn: 1.22.19 - /usr/local/bin/yarn\r\n npm: 9.4.2 - /usr/local/bin/npm\r\n pnpm: 8.9.2 - /usr/local/bin/pnpm\r\n npmPackages:\r\n @tresjs/cientos: ^3.5.1 => 3.5.1 \r\n @tresjs/core: ^3.4.1 => 3.4.1 \r\n @tresjs/eslint-config-vue: ^0.2.1 => 0.2.1 \r\n vite: ^4.5.0 => 4.5.0 \r\n```\n```\n\n\n### Used Package Manager\n\npnpm\n\n### Code of Conduct\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.\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[2975,2976,2977],{"name":2894,"color":2895},{"name":2857,"color":2858},{"name":2860,"color":2861},426,"TresGroups Pointer events missing","2024-01-23T12:07:00Z","https://github.com/Tresjs/tres/issues/426",0.740035,["Reactive",2984],{},["Set"],["ShallowReactive",2987],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fq4XQWmF2b_iwsF2DOBpTfzUqCpfUNcXaXediK6orrp4":-1},"/Tresjs/tres/511"]