\r\n \u003CTresMeshNormalMaterial />\r\n \u003CHtml\r\n center\r\n transform\r\n :distance-factor=\"4\"\r\n :position=\"[0, 0, 0.65]\"\r\n :scale=\"[0.75, 0.75, 0.75]\"\r\n >\r\n \u003Cdiv>\r\n \u003Cp>This should not scroll\u003C/p>\r\n \u003C/div>\r\n \u003C/Html>\r\n \u003C/TresMesh>\r\n```\r\nI expect the first element to scroll, and the second to stay.\r\n\r\n### System Info\r\n\r\n```shell\r\nSystem:\r\n OS: Linux 5.15 Ubuntu 22.04.3 LTS 22.04.3 LTS (Jammy Jellyfish)\r\n CPU: (8) x64 11th Gen Intel(R) Core(TM) i7-1165G7 @ 2.80GHz\r\n Memory: 3.82 GB / 11.69 GB\r\n Container: Yes\r\n Shell: 3.6.1 - /usr/bin/fish\r\n Binaries:\r\n Node: 21.5.0 - ~/.local/share/nvm/v21.5.0/bin/node\r\n Yarn: 1.22.19 - /usr/bin/yarn\r\n npm: 10.2.4 - ~/.local/share/nvm/v21.5.0/bin/npm\r\n pnpm: 8.14.1 - ~/.local/share/pnpm/pnpm\r\n bun: 1.0.7 - ~/.bun/bin/bun\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.",[2881,2884],{"name":2882,"color":2883},"pending-triage","97A4FE",{"name":2885,"color":2886},"waiting for author","B145BC",507,"Native html scroll and @tresjs/cientos Html component behaviour","2024-03-30T15:37:07Z","https://github.com/Tresjs/tres/issues/507",0.7897609,{"description":2893,"labels":2894,"number":2902,"owner":2856,"repository":2873,"state":2858,"title":2903,"updated_at":2904,"url":2905,"score":2906},"### Description\n\nAs a developer using TresJS, I want to add an LLM.txt file to the documentation repository so that AI assistants can better understand the project structure, APIs, and intended usage patterns.\n\nThis would enable developers to get more accurate assistance when working with TresJS through AI coding assistants, reducing friction and improving the development experience.\n\n### Suggested solution\n\nIn module [docs] we could provide the following implementation:\n\n1. Create an LLM.txt file at the root of the documentation repository\n2. Include the following content:\n - Overview of TresJS and its core concepts\n - Description of main APIs and components\n - Common usage patterns and examples\n - Project structure and organization\n - Links to key documentation sections\n3. Format the file in a way that's easily parseable by AI assistants\n4. Add documentation maintenance guidelines to ensure LLM.txt stays updated with future changes\n\nI plan to submit a PR for this issue once approved.\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.",[2895,2898,2899],{"name":2896,"color":2897},"docs","0075ca",{"name":2853,"color":2854},{"name":2900,"color":2901},"help wanted","008672",957,"[Docs] - Add LLM.txt to documentation site","2025-03-22T15:07:47Z","https://github.com/Tresjs/tres/issues/957",0.7922908,{"description":2908,"labels":2909,"number":1027,"owner":2856,"repository":2910,"state":2858,"title":2911,"updated_at":2912,"url":2913,"score":2914},"I was seeing how people gianluca (a youtuber, coder) use the library: https://www.youtube.com/watch?v=9Y8XGa7gg-E\r\n\r\nAnd one of the mistakes was the time to start a project, The ideal here would be to have a dedicated CLI for create a project with Tres. But the other options should be just point the started template to the people in the initial page. wdyt?",[],"tresjs.org","Point to the starting template","2024-12-30T15:42:30Z","https://github.com/Tresjs/tresjs.org/issues/21",0.8005726,{"description":2916,"labels":2917,"number":2921,"owner":2856,"repository":2922,"state":2858,"title":2923,"updated_at":2924,"url":2925,"score":2926},"Following https://www.youtube.com/watch?v=lcMCVWYpnrI&list=PLWP0narTpO8n9YwsTLVO7-vbIzLELrwwS",[2918],{"name":2919,"color":2920},"demo","CAC7AC",85,"lab","Fancy car showcase","2023-12-15T13:50:22Z","https://github.com/Tresjs/lab/issues/85",0.807451,{"description":2928,"labels":2929,"number":2933,"owner":2856,"repository":2873,"state":2858,"title":2934,"updated_at":2935,"url":2936,"score":2937},"### Description\n\nAs a maintainer of TresJS, I would like to apply the following changes to the `useRenderer`:\n\n- Drop renderer presets \n- Remove logic of renderer re-creation when TresCanvas props change (is not needed anymore since properties belonging to the renderer constructor args also affect canvas context, so recreation has no effect)\n- Remove plainRenderer for defaults (Defaults should be explicit)\n- Update TresCanvas types\n- Add watchers for updatable renderer options at runtime\n- Improve the huge watchEffect callback in the file. Separate watchEffect's are probably more efficient.\n\n\n\n\n### Suggested solution\n\n## Add watchers for updatable renderer options at runtime\n\n### WebGL options with set methods:\n\n| Option | Set Method | Default Value |\n|--------|------------|---------------|\n| clearColor | `renderer.setClearColor` | #000000 |\n| clearAlpha | `renderer.setClearAlpha` | 1 |\n\n\n### WebGL options with direct setters\n\n| Option | Set Method | Default Value | Comments |\n|--------|------------|---------------|---------------|\n| shadows | `renderer.shadowMap.enabled` | false ||\n| shadowMapType | `renderer.shadowMap.type` | PCFSoftShadowMap | Requires force material update |\n| outputColorSpace | `renderer.outputColorSpace` | [SRGBColorSpace](https://threejs.org/docs/index.html#api/en/constants/Textures)|\n| toneMapping | `renderer.toneMapping` | ACESFilmicToneMapping ||\n| toneMappingExposure | `renderer.toneMappingExposure` | 1 ||\n| dpr | `renderer.setPixelRatio` | 1 ||\n\n### Alternative\n\n_No response_\n\n### Additional context\n\nTres Canvas types:\n\n```\nexport type WebGLRendererProps = TransformToMaybeRefOrGetter\u003COmit\u003CWebGLRendererParameters, 'canvas'>>\n\n// TODO move following type. Props shouldn't be defined by passing a ref.\nexport interface TresCanvasProps extends /* @vue-ignore */ WebGLRendererProps {\n /**\n * WebGL Context options (Readonly because they are passed to the renderer constructor)\n * They can't be changed after the renderer is created because they are passed to the canvas context\n */\n /**\n * Enables antialiasing, smoothing out edges of 3D objects.\n * Uses MSAA (Multisample Anti-Aliasing) when available.\n * @readonly\n * @default true (Opinionated default by TresJS)\n */\n antialias?: boolean\n\n /**\n * Enables stencil buffer with 8 bits.\n * Required for stencil-based operations like shadow volumes or post-processing effects.\n * @readonly\n * @default true\n */\n stencil?: boolean\n\n /**\n * Enables depth buffer with at least 16 bits.\n * Required for proper 3D rendering and depth testing.\n * @readonly\n * @default true\n */\n depth?: boolean\n\n /**\n * Enables logarithmic depth buffer. Useful for scenes with large differences in scale.\n * Helps prevent z-fighting in scenes with objects very close and very far from the camera.\n * @readonly\n * @default false\n */\n logarithmicDepthBuffer?: boolean\n\n /**\n * Preserves the buffers until manually cleared or overwritten.\n * Needed for screenshots or when reading pixels from the canvas.\n * Warning: This may impact performance.\n * @readonly\n * @default false\n */\n preserveDrawingBuffer?: boolean\n\n /**\n * Power preference for the renderer.\n * Power preference for the renderer.\n * - `default`: Automatically chooses the most suitable power setting.\n * - `high-performance`: Prioritizes rendering performance.\n * - `low-power`: Tries to reduce power usage.\n * @see {@link https://threejs.org/docs/#api/en/renderers/WebGLRenderer}\n * @default 'default'\n * @readonly\n */\n powerPreference?: WebGLPowerPreference\n /**\n * Whether to create the WebGL context with an alpha buffer.\n * This is a WebGL context option that must be set during context creation and cannot be changed later.\n * When true, the canvas can be transparent, showing content behind it.\n * @readonly\n * @default false\n */\n alpha?: boolean\n\n /**\n * WebGL options with set methods\n * @see {@link https://threejs.org/docs/#api/en/renderers/WebGLRenderer}\n */\n\n /**\n * Clear color for the canvas\n * Can include alpha value (e.g. '#00808000' for fully transparent teal)\n */\n clearColor?: MaybeRefOrGetter\u003Cstring> // TODO this should also accept the other parts of ColorRepresentation\n\n /**\n * The opacity of the clear color (0-1)\n * Controls the transparency of the clear color\n * @default 1\n */\n clearAlpha?: MaybeRefOrGetter\u003Cnumber>\n\n /**\n * Enable shadow rendering in the scene\n * @default false\n */\n shadows?: MaybeRefOrGetter\u003Cboolean>\n\n /**\n * Tone mapping technique to use for the scene\n * - `NoToneMapping`: No tone mapping is applied.\n * - `LinearToneMapping`: Linear tone mapping.\n * - `ReinhardToneMapping`: Reinhard tone mapping.\n * - `CineonToneMapping`: Cineon tone mapping.\n * - `ACESFilmicToneMapping`: ACES Filmic tone mapping.\n * - `AgXToneMapping`: AgX tone mapping.\n * - `NeutralToneMapping`: Neutral tone mapping.\n * @see {@link https://threejs.org/docs/#api/en/constants/Renderer}\n * @default ACESFilmicToneMapping (Opinionated default by TresJS)\n */\n toneMapping?: MaybeRefOrGetter\u003CToneMapping>\n\n /**\n * Type of shadow map to use for shadow calculations\n * - `BasicShadowMap`: Basic shadow map.\n * - `PCFShadowMap`: Percentage-Closer Filtering shadow map.\n * - `PCFSoftShadowMap`: Percentage-Closer Filtering soft shadow map.\n * - `VSMShadowMap`: Variance shadow map.\n * @see {@link https://threejs.org/docs/#api/en/constants/Renderer}\n * @default PCFSoftShadowMap (Opinionated default by TresJS)\n */\n shadowMapType?: MaybeRefOrGetter\u003CShadowMapType>\n\n /**\n * Whether to use legacy lights system instead of the new one\n * @deprecated Use `useLegacyLights: false` for the new lighting system\n */\n useLegacyLights?: boolean\n\n /**\n * Color space for the output render\n * @see {@link https://threejs.org/docs/#api/en/constants/Renderer}\n */\n outputColorSpace?: MaybeRefOrGetter\u003CColorSpace>\n\n /**\n * Exposure level of tone mapping\n * @default 1\n */\n toneMappingExposure?: MaybeRefOrGetter\u003Cnumber>\n\n /**\n * Rendering mode for the canvas\n * - 'always': Renders every frame\n * - 'on-demand': Renders only when changes are detected\n * - 'manual': Renders only when explicitly called\n * @default 'always'\n */\n renderMode?: MaybeRefOrGetter\u003C'always' | 'on-demand' | 'manual'>\n\n /**\n * Device Pixel Ratio for the renderer\n * Can be a single number or a tuple defining a range [min, max]\n */\n dpr?: MaybeRefOrGetter\u003Cnumber | [number, number]>\n\n /**\n * Custom camera instance to use as main camera\n * If not provided, a default PerspectiveCamera will be created\n */\n camera?: TresCamera\n\n /**\n * Whether the canvas should be sized to the window\n * When true, canvas will be fixed positioned and full viewport size\n * @default false\n */\n windowSize?: MaybeRefOrGetter\u003Cboolean>\n\n /**\n * Whether to enable the provide/inject bridge between Vue and TresJS\n * When true, Vue's provide/inject will work across the TresJS boundary\n * @default true\n */\n enableProvideBridge?: MaybeRefOrGetter\u003Cboolean>\n}\n```\n\nOther relevant types\n\n```\ntype NamesOfPropsThatCannotChange = keyof Pick\u003C\n TresCanvasProps,\n 'depth' |\n 'alpha' |\n 'camera' | // this is handled in useCameras // TODO camera should be handled\n 'stencil' |\n 'renderer' |\n 'antialias' |\n 'precision' |\n 'powerPreference' |\n 'premultipliedAlpha' |\n 'preserveDrawingBuffer' |\n 'logarithmicDepthBuffer' |\n 'failIfMajorPerformanceCaveat'\n>\n\ntype NamesOfPropsThatCanChange = keyof Omit\u003C\n TresCanvasProps,\n NamesOfPropsThatCannotChange\n>\n```\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.",[2930],{"name":2931,"color":2932},"breaking-change","5612D2",982,"Refactor `useRenderer`","2025-04-17T13:11:55Z","https://github.com/Tresjs/tres/issues/982",0.8128531,{"description":2939,"labels":2940,"number":2941,"owner":2856,"repository":2873,"state":2858,"title":2942,"updated_at":2943,"url":2944,"score":2945},"### Describe the bug\r\n\r\nHi, does anyone have problems with slow **IntelliSense/suggestions** in **VSCode** ? I’ve been trying to debug this issue in my large app for the past few days, where suggestions appear after **2-6 seconds**. After a long time, the only thing that helped was removing Three.js. Is anyone else facing this issue, or perhaps have a solution? \r\nThanks.\r\n\r\nwith nuxt tresjs\r\nhttps://github.com/user-attachments/assets/dc468410-fb08-4961-a6f9-b3102b24ab77\r\n\r\nwithout nuxt tresjs\r\nhttps://github.com/user-attachments/assets/596c61a6-4cc9-40cd-9994-6a415b4bc684\r\n\r\nA clean project with only Nuxt and the Tres.js module is slow, and performance worsens as the project grows.\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/nuxt-starter-a3ltqbft?file=app.vue,package.json,nuxt.config.ts\r\n\r\n### Steps to reproduce\r\n\r\n{\r\n \"name\": \"nuxt-app\",\r\n \"private\": true,\r\n \"type\": \"module\",\r\n \"scripts\": {\r\n \"build\": \"nuxt build\",\r\n \"dev\": \"nuxt dev\",\r\n \"generate\": \"nuxt generate\",\r\n \"preview\": \"nuxt preview\",\r\n \"postinstall\": \"nuxt prepare\"\r\n },\r\n \"dependencies\": {\r\n \"@tresjs/core\": \"^4.3.1\",\r\n \"@tresjs/nuxt\": \"^3.0.7\",\r\n \"nuxt\": \"^3.14.1592\",\r\n \"three\": \"^0.171.0\",\r\n \"vue\": \"latest\",\r\n \"vue-router\": \"latest\"\r\n },\r\n \"packageManager\": \"pnpm@9.13.2+sha512.88c9c3864450350e65a33587ab801acf946d7c814ed1134da4a924f6df5a2120fd36b46aab68f7cd1d413149112d53c7db3a4136624cfd00ff1846a0c6cef48a\"\r\n}\r\n\r\n\r\n### System Info\r\n\r\n_No response_\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.",[],880,"Slow intellisense/suggestions","2024-12-07T21:32:15Z","https://github.com/Tresjs/tres/issues/880",0.81320614,{"description":2947,"labels":2948,"number":2950,"owner":2856,"repository":2873,"state":2951,"title":2952,"updated_at":2953,"url":2954,"score":2955},"**Describe the bug**\r\n\r\nDocumentation for events emitted by this component are missing\r\n\r\n- `dragging` event\r\n- `change` event\r\n- `mouseDown` event\r\n- `mouseUp` event\r\n- `objectChange` event\r\n\r\n**Reproduction**\r\nPlease provide a link using this template on [Stackblitz](https://stackblitz.com/edit/tresjs-basic?file=README.md) \r\n\r\n**Steps**\r\nSteps to reproduce the behavior:\r\n1. Go to '...'\r\n2. Click on '....'\r\n3. Scroll down to '....'\r\n4. See error\r\n",[2949],{"name":2896,"color":2897},64,"closed","Add events to TransformControls documentation","2023-01-07T18:45:57Z","https://github.com/Tresjs/tres/issues/64",0.78765523,{"description":2957,"labels":2958,"number":1229,"owner":2856,"repository":2873,"state":2951,"title":2960,"updated_at":2961,"url":2962,"score":2963},"Similar of [R3F Events](https://docs.pmnd.rs/react-three-fiber/api/events) would be nice to add Raytracing support",[2959],{"name":2867,"color":2868},"Events","2023-01-20T11:31:08Z","https://github.com/Tresjs/tres/issues/6",0.79577315,["Reactive",2965],{},["Set"],["ShallowReactive",2968],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fqne1Dn8AbAUX0Xrv6C44SqrwYQN4Cop66Lj-MsKDmoo":-1},"/Tresjs/tres/591"]