\r\n \r\n \u003CTeleport to=\"body\">\r\n \u003Cbutton @click=\"isVisible.value = false\">Hide GLTF\u003C/button>\r\n \u003C/Teleport>\r\n\u003C/template>\r\n```\r\n\r\n### Suggested solution\r\n\r\nEnable usage of portal-vue and/or Teleport. I have tried both, but they both throw different kinds of error:\r\n- portal-vue: \"[portal-vue]: Necessary Injection not found. Make sur you installed the plugin properly.\"\r\n- Teleport: \"Failed to locate Teleport target with selector \"body\" […]\"\r\n\r\nI suspect both errors are caused by the usage of a custom-renderer thus portal-vue/Teleport simply can't access their targets. It's a wild guess, but when moving everything outside of the `\u003CTresCanvas>` context it works just fine.\r\n\r\n### Alternative\r\n\r\n_No response_\r\n\r\n### Additional context\r\n\r\nI guess https://github.com/Tresjs/tres/issues/312 is somewhat of a similar topic\r\n\r\n### Validations\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.",[2903,2906],{"name":2904,"color":2905},"help wanted","008672",{"name":2907,"color":2908},"investigation","D03599",464,"Enable usage of \u003CTeleport>","2024-03-28T11:19:20Z","https://github.com/Tresjs/tres/issues/464",0.7015534,{"description":2915,"labels":2916,"number":2918,"owner":2857,"repository":2919,"state":2859,"title":2920,"updated_at":2921,"url":2922,"score":2923},"### Describe the bug\r\n\r\nFollowing a link with a named anchor to a page including `ScrollControls` does not scroll the resulting page to the anchor.\r\n\r\nE.g., where `http://example.org` is a page including `ScrollControls`, from a new tab, pasting `http://example.org#features` into the address bar and pressing `Return` will load the page, but the page will not be scrolled to the `features` anchor.\r\n\r\n#### Behavior\r\n\r\nOn page load, the page is not scrolled to the named anchor. (offset y = 0)\r\n\r\n#### Expected behavior\r\n\r\nOn page load, the page should be scrolled to the named anchor.\r\n\r\n\r\n### Reproduction\r\n\r\nNo StackBlitz provided. It doesn't appear that the bug is reproducible on StackBlitz' window-in-window setup.\r\n\r\n### Steps to reproduce\r\n\r\n#### Example markup\r\n\r\n```\r\n\u003Ca href=\"#two\">Jump to section 2\u003C/a>\r\n\u003Csection>\u003Ch1>Section 1\u003C/h1>\u003C/section>\r\n\u003Csection>\u003Ch2 id=\"#two\">Section 2\u003C/h2>\u003C/section>\r\n```\r\n\r\n1. In the text editor, insert the example markup into the playground/src/pages/controls/ScrollControlsDemo.vue and save.\r\n2. On the command line, start the playground with `pnpm run playground` if not already running.\r\n3. In the browser, open a new, blank tab.\r\n4. In the browser, paste `http://localhost:5173/controls/scroll-controls#two` in the address bar and hit `Enter`.\r\n\r\n\r\n### System Info\r\n\r\n```shell\r\nSystem:\r\n OS: macOS 14.0\r\n CPU: (8) arm64 Apple M1\r\n Memory: 77.72 MB / 8.00 GB\r\n Shell: 5.9 - /bin/zsh\r\n Binaries:\r\n Node: 20.8.1 - /opt/homebrew/bin/node\r\n npm: 10.1.0 - /opt/homebrew/bin/npm\r\n pnpm: 8.6.5 - /opt/homebrew/bin/pnpm\r\n Browsers:\r\n Chrome: 119.0.6045.199\r\n Safari: 17.0\r\n npmPackages:\r\n @tresjs/core: 3.5.0 => 3.5.0 \r\n @tresjs/eslint-config-vue: ^0.2.1 => 0.2.1 \r\n vite: ^4.5.0 => 5.0.4 \r\n\r\nTested in Chrome, FF, Safari on Mac.\r\n```\r\n\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.\r\n\r\nRelated: https://github.com/Tresjs/cientos/pull/288#issuecomment-1838828275",[2917],{"name":2868,"color":2869},301,"cientos","ScrollControls: external links to named anchors don't scroll the page","2024-10-25T08:05:04Z","https://github.com/Tresjs/cientos/issues/301",0.70953697,{"description":2925,"labels":2926,"number":2932,"owner":2857,"repository":2919,"state":2933,"title":2934,"updated_at":2935,"url":2936,"score":2937},"### Description\n\nAs a developer of Tres/Cientos, I would like reorganizations to be simpler.\r\n\r\nMoving a component from one category to another requires a lot of changes (12) to the codebase:\r\n\r\n\u003Cimg width=\"235\" alt=\"Screenshot 2024-04-10 at 18 19 42\" src=\"https://github.com/Tresjs/cientos/assets/20469369/d40dcd09-e622-4ec1-bb08-457b2cf8788a\">\n\n### Suggested solution\n\n## Flatten the file structure\r\n\r\n* Move all components from `/src/core` and `/src/componsables` to `/src`\r\n* Move all components from `/playground/pages/*` to `/playground/pages`\r\n* Move all .md files from `/docs/guide/*` to `/docs/guide`\r\n* Update `index.ts` etc. to reflect the changes\r\n\r\n## Maintain the views/routes\r\n\r\nThe views/routes in the docs and playground would remain unchanged for the user.\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.",[2927,2929],{"name":2907,"color":2928},"D0359D",{"name":2930,"color":2931},"p1-chore","BFD4F2",381,"closed","Reorganize: keep views/routes, flatten file structure?","2024-04-16T15:36:57Z","https://github.com/Tresjs/cientos/issues/381",0.67942625,{"description":2939,"labels":2940,"number":2950,"owner":2857,"repository":2858,"state":2933,"title":2951,"updated_at":2952,"url":2953,"score":2954},"### Description\n\nCurrently, `TresObject3D#material` doesn't allow to set array. My suggestion is to make Array acceptable as well.\r\n\r\nhttps://github.com/Tresjs/tres/blob/main/src/types/index.ts#L43\r\n\r\n```\r\n- material?: THREE.Material & TresBaseObject\r\n+ material?: THREE.Material & TresBaseObject | (THREE.Material & TresBaseObject)[]\r\n```\r\n\r\n## (Personal) reason\r\n\r\nI use TresJS and [spine-ts THREE.JS](https://github.com/EsotericSoftware/spine-runtimes/blob/4.1/spine-ts/spine-threejs/README.md). \r\n\r\nTHREE.Mesh#material's type is `Material | Material[]`. (https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/three/src/objects/Mesh.d.ts#L24)\r\n\r\nspine-ts' set Array material according to THREE's type. (https://github.com/EsotericSoftware/spine-runtimes/blob/4.1/spine-ts/spine-threejs/src/MeshBatcher.ts#L60)\r\n\r\nHowever, `TresObject3D#material` doesn't allow to set Array material, when a spine's mesh is rendered in Scene of TresJS and a material**s** in spine's mesh are evaluate, TresJS throws runtime error.\r\n\r\n\r\n## Basis that my suggestion is reasonable\r\n\r\nA type of THREE.Mesh#material extending THREE.Object3D is `Material | Material[]`, so I think it's reasonable that a type of `TresObject3D#material` extending THREE.Object3D is `THREE.Material & TresBaseObject | (THREE.Material & TresBaseObject)[]`.\r\n\n\n### Suggested solution\n\nhttps://github.com/Tresjs/tres/blob/main/src/types/index.ts#L43\r\n\r\n```\r\n- material?: THREE.Material & TresBaseObject\r\n+ material?: THREE.Material & TresBaseObject | (THREE.Material & TresBaseObject)[]\r\n```\r\n\r\nand adding logic for array.\n\n### Alternative\n\nnothing. I currently use pnpm patch and add logic for array.\n\n### Additional context\n\nI can create PR for this suggestion.\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.",[2941,2944,2947],{"name":2942,"color":2943},"types","5C076E",{"name":2945,"color":2946},"PR welcome","2D76B0",{"name":2948,"color":2949},"p3-significant","2C78E3",496,"Allow `TresObject3D#material` to set Array","2024-07-05T15:18:00Z","https://github.com/Tresjs/tres/issues/496",0.682635,{"description":2956,"labels":2957,"number":2964,"owner":2857,"repository":2858,"state":2933,"title":2965,"updated_at":2966,"url":2967,"score":2968},"### 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.",[2958,2961],{"name":2959,"color":2960},"question","d876e3",{"name":2962,"color":2963},"waiting for author","B145BC",310,"Black Canvas in Firefox","2023-06-20T07:13:04Z","https://github.com/Tresjs/tres/issues/310",0.68452054,{"description":2970,"labels":2971,"number":2972,"owner":2857,"repository":2858,"state":2933,"title":2973,"updated_at":2974,"url":2975,"score":2976},"### Describe the bug\r\n\r\nFor class [`Material`](https://threejs.org/docs/index.html#api/en/materials/Material) we have [onBeforeCompile ](https://threejs.org/docs/index.html#api/en/materials/Material.onBeforeCompile)method, R3f provide onBeforeCompile prop to use that ([example](https://codesandbox.io/s/r3f-basic-demo-forked-ftwcm)), and I think Tresjs should have something like this.\r\n\r\nI tried to use `@beforeCompile` will warn \r\n\r\n\r\nand `onBeforeCompile` both don't work, I guess this might be a bug or this is a feature doesn't implement yet?\r\n\r\nI provide a reproduction with a Codesandbox copy from [the official playground](https://github.com/Tresjs/playground/tree/main/components/content/basic-shaders), just run and see no stdout which should have\r\n\r\n### Reproduction\r\n\r\nhttps://codesandbox.io/p/sandbox/hopeful-goodall-y86d74?file=%2Fsrc%2FApp.vue%3A44%2C9\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/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.",[],360,"onBeforeCompile prop of material doesn't work","2024-05-05T16:00:38Z","https://github.com/Tresjs/tres/issues/360",0.68875617,["Reactive",2978],{},["Set"],["ShallowReactive",2981],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fmEsCo5sY4dZquO6gHm-Kf8QKQnn9xMkwXGwbEFFuxNo":-1},"/Tresjs/tres/556"]