\r\n \u003COrbitControls />\r\n \u003CTresAmbientLight :intensity=\"0.5\" color=\"red\" />\r\n \u003CTresMesh ref=\"boxRef\" :position=\"[0, 2, 0]\">\r\n \u003CTresBoxGeometry :args=\"[1, 1, 1]\" />\r\n \u003CTresMeshNormalMaterial />\r\n \u003C/TresMesh>\r\n \u003CTresDirectionalLight :position=\"[0, 2, 4]\" :intensity=\"1\" cast-shadow />\r\n \u003CTresAxesHelper />\r\n \u003CTresGridHelper :args=\"[10, 10, 0x444444, 'teal']\" />\r\n \u003C/TresGroup>\r\n````\r\nThen I got this\r\n\r\n\r\n**However, it can run correctly in `v3.9.0`**\r\n\r\n\n\n### Reproduction\n\nhttps://stackblitz.com/~/github.com/hexianWeb/starter\n\n### Steps to reproduce\n\n_No response_\n\n### System Info\n\n_No response_\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.",[2852,2855,2858],{"name":2853,"color":2854},"question","d876e3",{"name":2856,"color":2857},"waiting for author","B145BC",{"name":2859,"color":2860},"p2-edge-case","ABCC40",727,"Tresjs","tres","open","`Camera` wrapped by `TresGroup` cannot be used properly after `version 4.0`","2024-06-15T11:45:11Z","https://github.com/Tresjs/tres/issues/727",0.7248655,{"description":2870,"labels":2871,"number":2881,"owner":2862,"repository":2863,"state":2864,"title":2882,"updated_at":2883,"url":2884,"score":2885},"### Description\n\nWebGPU [Three.js r171](https://github.com/mrdoob/three.js/releases) has been released and it’s a major milestone for WebGPU integration with third-party libraries such as React Three Fiber and bundlers like Vite or Next.js. We can now do this with zero configuration:\r\n\r\nThree.js Vanilla Three.js\r\n\r\n```ts\r\nimport * as THREE from 'three'\r\nimport { WebGPURenderer } from 'three/webgpu'\r\n \r\nconst renderer = new WebGPURenderer()\r\n```\r\n\r\nR3F\r\n\r\n```ts\r\nimport { Canvas } from '@react-three/fiber'\r\nimport { WebGPURenderer } from 'three/webgpu'\r\n \r\n\u003CCanvas gl={canvas => new WebGPURenderer({ canvas })}>\r\n```\n\n### Suggested solution\n\nEnable a `renderer` prop to override the renderer, restricted to canvas-based WebGL/WebGPU renderers.\r\n\r\n```vue\r\n\u003Cscript setup>\r\nimport { WebGPURenderer } from 'three/webgpu'\r\n\u003C/script>\r\n\r\n\u003Ctemplate>\r\n \u003CTresCanvas :renderer=\"WebGPURenderer\" />\r\n\u003C/template>\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.",[2872,2875,2878],{"name":2873,"color":2874},"feature","c2e0c6",{"name":2876,"color":2877},"p3-significant","2C78E3",{"name":2879,"color":2880},"v5","EFC959",883,"WebGPU support","2025-02-06T09:35:42Z","https://github.com/Tresjs/tres/issues/883",0.739195,{"description":2887,"labels":2888,"number":2899,"owner":2862,"repository":2863,"state":2864,"title":2900,"updated_at":2901,"url":2902,"score":2903},"### Description\n\nHow to use vue-cli\n\n### Suggested solution\n\nHow to use vue-cli\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.",[2889,2892,2895,2898],{"name":2890,"color":2891},"bug","d73a4a",{"name":2893,"color":2894},"help wanted","008672",{"name":2896,"color":2897},"PR welcome","2D76B0",{"name":2859,"color":2860},754,"How to use vue-cli","2024-08-21T09:51:50Z","https://github.com/Tresjs/tres/issues/754",0.7399003,{"description":2905,"labels":2906,"number":2910,"owner":2862,"repository":2863,"state":2864,"title":2911,"updated_at":2912,"url":2913,"score":2914},"### Description\n\nAs a developer, I would like to have the same DX devtools experience provided by the [Nuxt devtools ](https://devtools.nuxt.com/) for vue using https://github.com/vuejs/devtools-next\n\n### Suggested solution\n\nCustom tab at https://github.com/vuejs/devtools-next\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.",[2907],{"name":2908,"color":2909},"dx","1576AD",489,"Vue devtools ","2024-03-28T11:19:19Z","https://github.com/Tresjs/tres/issues/489",0.740674,{"description":2916,"labels":2917,"number":2924,"owner":2862,"repository":2925,"state":2926,"title":2927,"updated_at":2928,"url":2929,"score":2930},"### Description\r\n\r\nKeyboardControls could be improved.\r\n\r\nCurrently, is not supporting [magic keys](https://vueuse.org/core/useMagicKeys/#usemagickeys). And remove the 2D mode\r\nCould use the camera as a group (like in the MouseParallax) for the jump function, and the headBobbing, and avoid fighting with cameras\r\nImprove the usability for thirdCamera Games\r\n\r\n\r\n### Suggested solution\r\n\r\n.\r\n\r\n### Alternative\r\n\r\nAny other alternative is considered\r\n\r\nWe don't take mobile functionality here, that will be in another issue\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.",[2918,2921],{"name":2919,"color":2920},"v4","EEF2B0",{"name":2922,"color":2923},"breaking-change","5319E7",227,"cientos","closed","Improve KeyboardControls","2024-09-04T13:43:10Z","https://github.com/Tresjs/cientos/issues/227",0.6644754,{"description":2932,"labels":2933,"number":2934,"owner":2862,"repository":2863,"state":2926,"title":2935,"updated_at":2936,"url":2937,"score":2938},"### Describe the bug\n\nIn our project we render many sphere meshes and clicking on them will change the color. They are rendered using v-for. Clicking to change the color works for the first 47 spheres but any more added above that do not work.\n\n### Reproduction\n\nhttps://stackblitz.com/edit/vitejs-vite-gstaas?file=src%2FApp.vue\n\n### Steps to reproduce\n\nTo reproduce, open the reproduction link in a Chromium browser.\r\nI have colored the first 47 spheres yellow. You can click these to change the color.\r\nI have colored an additional 3 spheres purple. Clicking these won't change the color.\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.",[],556,"v-for doesn't rerender color after 47 elements","2024-02-18T00:39:12Z","https://github.com/Tresjs/tres/issues/556",0.69085735,{"description":2940,"labels":2941,"number":2948,"owner":2862,"repository":2863,"state":2926,"title":2949,"updated_at":2950,"url":2951,"score":2952},"### Describe the bug\r\n\r\nProperties changed (animated) through template ref modification are not triggering `invalidate` on `render-mode=\"on-demand\"`\r\n\r\n\r\n### Reproduction\r\n\r\nhttp://localhost:5173/perf/on-demand\r\n\r\n### Steps to reproduce\r\n\r\nOn core playground go to `http://localhost:5173/perf/on-demand` and animate an object in the following way:\r\n\r\n```\r\nconst { onLoop } = useRenderLoop()\r\n\r\nonLoop(({ elapsed }) => {\r\n if (!sphereRef.value) { return }\r\n sphereRef.value.position.x += Math.sin(elapsed) * 0.01\r\n})\r\n```\r\n\r\nNotice that this doesn't trigger a render\r\n\r\n### System Info\r\n\r\n```shell\r\nSystem:\r\n OS: macOS 14.3.1\r\n CPU: (8) arm64 Apple M1 Pro\r\n Memory: 69.72 MB / 16.00 GB\r\n Shell: 5.9 - /bin/zsh\r\n Binaries:\r\n Node: 18.14.1 - ~/.nvm/versions/node/v18.14.1/bin/node\r\n Yarn: 1.22.19 - /usr/local/bin/yarn\r\n npm: 9.3.1 - ~/.nvm/versions/node/v18.14.1/bin/npm\r\n Browsers:\r\n Brave Browser: 120.1.61.116\r\n Chrome: 123.0.6312.123\r\n Firefox: 121.0.1\r\n Safari: 17.3.1\r\n npmPackages:\r\n @tresjs/cientos: 3.6.0 => 3.6.0 \r\n @tresjs/core: workspace:^ => 4.0.0-next.2 \r\n @tresjs/leches: 0.15.0-next.3 => 0.15.0-next.3 \r\n```\r\n\r\n\r\n### Used Package Manager\r\n\r\npnpm\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/tres/blob/main/CODE_OF_CONDUCT.md)\r\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/tres/blob/main/CONTRIBUTING.md).\r\n- [X] Read the [docs](https://tresjs.org/guide).\r\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.\r\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[2942,2943,2945],{"name":2890,"color":2891},{"name":2919,"color":2944},"7980EA",{"name":2946,"color":2947},"p4-important-bug","D93F0B",639,"[v4] - Animations with onLoop doesn't trigger on-demand rendering","2024-04-13T12:47:48Z","https://github.com/Tresjs/tres/issues/639",0.6948479,{"description":2954,"labels":2955,"number":2961,"owner":2862,"repository":2863,"state":2926,"title":2962,"updated_at":2963,"url":2964,"score":2965},"**Is your feature request related to a problem? Please describe.**\r\nThere is no type definition for primitive\r\n\r\n",[2956,2959,2960],{"name":2957,"color":2958},"good first issue","7057ff",{"name":2893,"color":2894},{"name":2908,"color":2909},255,"Primitive type definition","2023-05-21T09:05:02Z","https://github.com/Tresjs/tres/issues/255",0.706361,{"description":2967,"labels":2968,"number":2971,"owner":2862,"repository":2863,"state":2926,"title":2972,"updated_at":2973,"url":2974,"score":2975},"### Describe the bug\n\nIt seems like Tres.js is no longer working in Firefox. Even on your official documentation all examles render just a black canvas.\r\nI would really like to use Tres.js in projects of my company, but I am unable to do this if Firefox is not supported or working :(\n\n### Reproduction\n\nhttps://tresjs.org/guide/\n\n### Steps to reproduce\n\nThe first and all other examples of this page.\n\n### System Info\n\n```shell\nWindows 10\r\nFirerfiox version 114.0.1 (64-Bit)\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/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.",[2969,2970],{"name":2853,"color":2854},{"name":2856,"color":2857},310,"Black Canvas in Firefox","2023-06-20T07:13:04Z","https://github.com/Tresjs/tres/issues/310",0.7105064,{"description":2977,"labels":2978,"number":2979,"owner":2862,"repository":2925,"state":2926,"title":2980,"updated_at":2981,"url":2982,"score":2983},"### Description\n\nCurrently, in the cientos docs there are just a few examples of the components, it will be better to provide examples as in MeshWobbleMaterial to as many components as possible\n\n### Suggested solution\n\nBasically add example to all abstractions, controls, shapes, material and misc. Possible\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/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.",[],177,"Add more examples to the Cientos docs","2023-09-13T13:31:29Z","https://github.com/Tresjs/cientos/issues/177",0.71498084,["Reactive",2985],{},["Set"],["ShallowReactive",2988],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fcacGQCibApV8qnYnHgFMoPPmgU22RvcBRaxKY2JK1DY":-1},"/Tresjs/tres/494"]