\n \u003COrbitControls />\n \u003CImage :url=\"URLS[0]\" :radius=\"0.2\" :transparent=\"true\" :position=\"[-1.5, 0, -1]\" />\n \u003CImage :url=\"URLS[1]\" :radius=\"0.2\" :transparent=\"true\" />\n \u003CImage :url=\"URLS[2]\" :radius=\"0.2\" :transparent=\"true\" :position=\"[1.5, 0, -1]\" />\n \u003C/TresCanvas>\n\u003C/template>\n```\n\n### System Info\n\n```shell\n\n```\n\n### Used Package Manager\n\nyarn\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.",[],613,"Tresjs","cientos","open","Wrong color space in the Image abstraction?","2025-04-18T23:18:54Z","https://github.com/Tresjs/cientos/issues/613",0.7604815,{"description":2874,"labels":2875,"number":2879,"owner":2866,"repository":2880,"state":2868,"title":2881,"updated_at":2882,"url":2883,"score":2884},"The current API is far from ideal, we initially followed the same DX as https://github.com/pmndrs/leva \r\nbut encountered number of issues\"\r\n\r\n- Need to use `value.value` for multiple controls #92 \r\n- Shared `useControls` composable, impossible to have multiple distinct instances #98 \r\n\r\nI will copy the different suggestions from @andretchen0 \r\n\r\n## Example: Tweakpane\r\n\r\n[Tweakpane | Bindings](https://tweakpane.github.io/docs/input-bindings/)\r\n\r\nTweakpane uses `.addBinding(stateObject, key, params)`.\r\n\r\n```ts\r\nconst PARAMS = {\r\n speed: 50,\r\n};\r\n\r\nconst pane = new Pane();\r\npane.addBinding(PARAMS, 'speed', {\r\n min: 0,\r\n max: 100,\r\n});\r\n```\r\n\r\nWith this setup, there's no need for a `watch` and so no `value.value`. The value is already being \"watched\" with the configuration above.\r\n\r\n## Example: v-tweakpane\r\n\r\nA variation of Tweakpane, this time with Vue. Like Tweakpane, it uses a specific method for creating a widget and binding at the same time. This avoids the need to `watch` and avoids `.value.value`.\r\n\r\n```ts\r\nconst onPaneTwoCreated = (pane: any) => {\r\n pane.registerPlugin(CamerakitPlugin);\r\n const PARAMS = {\r\n flen: 55,\r\n fnum: 1.8,\r\n iso: 100,\r\n };\r\n pane.addInput(PARAMS, 'flen', {\r\n view: 'cameraring',\r\n series: 0,\r\n unit: { pixels: 50, ticks: 10, value: 0.2 },\r\n min: 1,\r\n step: 0.02,\r\n });\r\n```\r\n\r\nThe [example](https://github.com/vinayakkulkarni/v-tweakpane/blob/main/example/src/App.vue) uses some callbacks for setup, which Leches doesn't need. Personally, I'd like to avoid having those.\r\n\r\n## Example: Vuetify\r\n\r\nIn this [Vuetify example](https://vuetifyjs.com/en/components/sliders/#min-and-max), most of the config that Leches does in `\u003Csetup>` is handled in `\u003Ctemplate>`. Bindings are created using `v-model` in the `\u003Ctemplate>`.\r\n\r\n```html\r\n\u003Ctemplate>\r\n \u003Cv-slider\r\n v-model=\"slider\"\r\n class=\"align-center\"\r\n :max=\"max\"\r\n :min=\"min\"\r\n hide-details\r\n >\r\n \u003Ctemplate v-slot:append>\r\n \u003Cv-text-field\r\n v-model=\"slider\"\r\n hide-details\r\n single-line\r\n density=\"compact\"\r\n type=\"number\"\r\n style=\"width: 70px\"\r\n >\u003C/v-text-field>\r\n \u003C/template>\r\n \u003C/v-slider>\r\n\u003C/template>\r\n\r\n\u003Cscript>\r\n export default {\r\n data () {\r\n return {\r\n min: -50,\r\n max: 90,\r\n slider: 40,\r\n }\r\n },\r\n }\r\n\u003C/script>\r\n```",[2876],{"name":2877,"color":2878},"enhancement","a2eeef",104,"leches","Rethink API and DX","2024-04-27T19:31:44Z","https://github.com/Tresjs/leches/issues/104",0.7706961,{"description":2886,"labels":2887,"number":2894,"owner":2866,"repository":2895,"state":2868,"title":2896,"updated_at":2897,"url":2898,"score":2899},"### Description\r\n\r\nVia @andretchen0: \r\n\r\nAbout answering the question, \"Should the next tick update/render?\", we currently have renderMode, manual, etc.\r\n\r\n# Problem?\r\nThe v4 implementation is mostly located in `useTresContext`, which is already very busy.\r\n`\u003CTresCanvas />` currently only accepts 1 string flag from the user. Using only flags means the system relies solely on us predicting users' needs and implementing a \"mode\" for them.\r\nAccepting only a single flag means we can't have a compound policy, e.g., \"rerender if advance or invalidate were called or the window resized. Afaik, this currently leads to cases where manual is the mode – the canvas will be blank if the window is resized, until invalidate is called.\r\n\r\n\r\n\r\n### Suggested solution\r\n\r\nEncapsulate the logic for \"Should the next tick update/render?\" in a module – maybe `src/core/renderPolicy.ts`?\r\nLet the render policy be specified via functions/objects as follows:\r\n\r\n```ts\r\nimport { createRenderPolicy, manual } from '...'\r\nconst policy = createRenderPolicy(manual)\r\nconst { invalidate } = policy\r\n...\r\n\u003CTresCanvas :render-policy=\"policy\" />\r\n```\r\n\r\nAbove, \r\n\r\n- manual is \"rule\" function that contains its own state, tracking if invalidate() was called since the last update.\r\n- policy is an object that relays calls to invalidate and advance to its rules, then asks the rules if the next tick should update/render or not.\r\n\r\nIn this way, we could have compound policies. E.g.,\r\n\r\n```ts\r\n// NOTE: This policy will approve the next tick of jobs if ...\r\n// - `invalidate()` was called\r\n// - the window was resized\r\n// but cancel if ...\r\n// - the canvas is off-screen\r\nconst { shouldUpdate, invalidate } = createRenderPolicy([manual, windowResize, cancelIfOffScreen])\r\nshouldUpdate() // false\r\ninvalidate()\r\nshouldUpdate() // true\r\n```\r\n\r\nRules would be evaluated in FILO order, with the result of lower ranking rules being passed to higher ranking rules, so this ...\r\n\r\n```\r\ncreateRenderPolicy([manual, cancelIfOffScreen, windowResize])\r\n```\r\n\r\n... cancels true from windowResize if the canvas is offscreen. But if the canvas is off-screen, manual's advance(n) will still take precedence.\r\n\r\nWhereas here ...\r\n\r\n```\r\ncreateRenderPolicy([cancelIfOffScreen, manual, windowResize])\r\n```\r\n\r\n... `cancelIfOffScreen` takes precedence over the other 2 rules and cancels both if the canvas is off-screen. \r\n----\r\n\r\nRules are relatively simple to write and users could supply their own rules, if we surface that in the API. Here's a \"complicated\" rule – `windowResize` – in its current form:\r\n\r\n```ts\r\nexport const windowResize: CreateUpdateRule = () => {\r\n let invalidated = true\r\n const invalidate = () => { invalidated = true }\r\n window.addEventListener('resize', invalidate)\r\n return {\r\n shouldUpdate: (lowRankResult: boolean) => {\r\n const result = invalidated\r\n invalidated = false\r\n return result || lowRankResult\r\n },\r\n dispose: () => {\r\n window.removeEventListener('resize', invalidate)\r\n }\r\n }\r\n}\r\n```\r\nHere's manual:\r\n\r\n```ts\r\nexport const manual: CreateUpdateRule = () => {\r\n let numFramesToAdvance = 0\r\n return {\r\n advance: (numFrames = 1) => {\r\n numFramesToAdvance = Math.max(numFramesToAdvance, numFrames)\r\n },\r\n shouldUpdate: (lowRankResult: boolean) => {\r\n const result = numFramesToAdvance > 0\r\n numFramesToAdvance = Math.max(0, numFramesToAdvance - 1)\r\n return result || lowRankResult\r\n }\r\n }\r\n}\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/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\r\nEdit (andretchen0): fixed formatting ",[2888,2891],{"name":2889,"color":2890},"feature","c2e0c6",{"name":2892,"color":2893},"pending-triage","97A4FE",689,"tres","Render mode policies","2024-05-24T14:21:03Z","https://github.com/Tresjs/tres/issues/689",0.7725769,{"description":2901,"labels":2902,"number":2909,"owner":2866,"repository":2867,"state":2910,"title":2911,"updated_at":2912,"url":2913,"score":2914},"### Description\r\n\r\nAs a developer using TresJS, I want \r\n- Environment props to be reactive\r\n- More presets other than 'sunset' (city, etc)\r\n\r\n so that:\r\n- I can dynamically configure the preset or toggle the `background` property\r\n\r\n### Suggested solution\r\n\r\nModify the `useEnvironment/component.ts` component so:\r\n\r\n- Convert to vue file SFC\r\n- texture should be a ref\r\n- Set the default for the props here.\r\n\r\nModify the `useEnvironment/index.ts` composable so:\r\n\r\n- Reacts to prop changes (Using watchers and computed)\r\n- Return the texture as a ref\r\n\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.",[2903,2906],{"name":2904,"color":2905},"good first issue","7057ff",{"name":2907,"color":2908},"help wanted","008672",147,"closed","Enhance Environment and useEnvironment abstractions","2023-10-09T17:33:47Z","https://github.com/Tresjs/cientos/issues/147",0.7465916,{"description":2916,"labels":2917,"number":2909,"owner":2866,"repository":2927,"state":2910,"title":2928,"updated_at":2929,"url":2930,"score":2914},"Attempting to use the 1.0.0 release with Nuxt, I get an error on the `nuxt prepare` step. This is reproducible within this repo's nuxt playground if you update the dependency to 1.0.0.\r\n\r\n```\r\n ERROR ENOENT: no such file or directory, open '/Users/.../.../post-processing/playground-nuxt/@tresjs/post-processing' 10:29:39 AM\r\n ```\r\n\r\nThis does not happen when using `1.0.0-next.1`.\r\n\r\n```\r\n- Operating System: Darwin\r\n- Node Version: v20.10.0\r\n- Nuxt Version: 3.14.1592\r\n- CLI Version: 3.15.0\r\n- Nitro Version: 2.10.4\r\n- Package Manager: npm@10.8.3\r\n- Builder: -\r\n- User Config: default\r\n- Runtime Modules: @nuxt/eslint@0.7.2, @pinia/nuxt@0.7.0, @nuxtjs/supabase@1.4.3, @primevue/nuxt-module@4.2.4, @nuxtjs/tailwindcss@6.12.2, nuxt-lodash@2.5.3, @nuxt/icon@1.8.2, @tresjs/nuxt@3.0.7\r\n- Build Modules: -\r\n```\r\n\r\nThanks for maintaining this project!",[2918,2921,2924],{"name":2919,"color":2920},"bug","d73a4a",{"name":2922,"color":2923},"p4-important-bug","D93F0B",{"name":2925,"color":2926},"types","5C076E","post-processing","Broken imports in v1.0.0 w/ Nuxt","2025-01-03T09:37:19Z","https://github.com/Tresjs/post-processing/issues/147",{"description":2932,"labels":2933,"number":1909,"owner":2866,"repository":2895,"state":2910,"title":2936,"updated_at":2937,"url":2938,"score":2939},"## Describe the bug\r\n\r\n`TextGeometry` text starts at the mesh initial position, so it's `[0,0,0]` the text will start there. Atm the only way of centering is to add a negative `x` value to the mesh.\r\n\r\nOn vanilla threeJS the code would look like this\r\n\r\n```typescript\r\nimport { TextGeometry } from 'three/examples/jsm/geometries/TextGeometry.js'\r\n\r\n const textGeometry = new TextGeometry(\r\n 'Hola TresJS',\r\n {\r\n font: font,\r\n size: 0.5,\r\n height: 0.2,\r\n curveSegments: 12,\r\n bevelEnabled: true,\r\n bevelThickness: 0.03,\r\n bevelSize: 0.02,\r\n bevelOffset: 0,\r\n bevelSegments: 5\r\n }\r\n)\r\n\r\ntextGeometry.center()\r\n```\r\n\r\n## Current\r\n\r\n` \u003CText3D center />` is not centering the text\r\n\r\n## Desired\r\n\r\n `\u003CText3D center />` should center the text",[2934,2935],{"name":2919,"color":2920},{"name":2904,"color":2905},"Text3D is missing center prop","2022-12-15T15:24:59Z","https://github.com/Tresjs/tres/issues/31",0.76044494,{"description":2941,"labels":2942,"number":285,"owner":2866,"repository":2895,"state":2910,"title":2944,"updated_at":2945,"url":2946,"score":2947},"Render 3D text using ThreeJS's [TextGeometry](https://threejs.org/docs/index.html?q=textg#examples/en/geometries/TextGeometry).\r\n\r\nText3D will suspend while loading the font data. Text3D requires fonts in JSON format generated through [http://gero3.github.io/facetype.js](http://gero3.github.io/facetype.js/), either as a path to a JSON file or a JSON object. If you face display issues try checking \"Reverse font direction\" in the typeface tool.\r\n```\r\n\u003CText3D :font=\"fontUrl\" v-bind=\"{...textOptions}\">\r\n Hola Tres\r\n \u003CTresMeshNormalMaterial />\r\n\u003C/Text3D>\r\n```",[2943],{"name":2889,"color":2890},"Text3D cientos","2022-12-08T10:14:11Z","https://github.com/Tresjs/tres/issues/15",0.76889086,{"description":2949,"labels":2950,"number":2954,"owner":2866,"repository":2895,"state":2910,"title":2955,"updated_at":2956,"url":2957,"score":2958},"**Describe the bug**\r\nThe following props are not being properly updated:\r\n\r\n- `enabled`.\r\n- `showX`, `showY`, `showZ`\r\n- `axis`.\r\n\r\n**Reproduction**\r\n[Stackblitz](https://stackblitz.com/edit/tresjs-transform-controls?file=src%2Fcomponents%2FTheExperience.vue,package.json) \r\n\r\n**Steps**\r\nSteps to reproduce the behavior:\r\n1. Go to[ '...'](https://stackblitz.com/edit/tresjs-transform-controls?file=src%2Fcomponents%2FTheExperience.vue,package.json)\r\n2. Play with props on the panel top right\r\n\r\n**Expected behavior**\r\nAll props work\r\n\r\n\r\n**System Info**\r\nOutput of `npx envinfo --system --npmPackages '{vite,@tresjs/*, three, vue}' --binaries --browsers` \r\n\r\n```\r\n System:\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: 16.14.2 - /usr/local/bin/node\r\n Yarn: 1.22.19 - /usr/local/bin/yarn\r\n npm: 7.17.0 - /usr/local/bin/npm\r\n npmPackages:\r\n @tresjs/cientos: ^1.3.0 => 1.3.0 \r\n @tresjs/core: ^1.4.0 => 1.4.0 \r\n vite: ^3.2.4 => 3.2.4 \r\n```\r\n\r\n**Additional context**\r\nMost probably is because this properties doesn't use a `set` function\r\n",[2951,2952,2953],{"name":2919,"color":2920},{"name":2904,"color":2905},{"name":2907,"color":2908},63,"TransformControls cientos props without set method not updating","2023-01-07T18:45:57Z","https://github.com/Tresjs/tres/issues/63",0.77063626,{"description":2960,"labels":2961,"number":2879,"owner":2866,"repository":2964,"state":2910,"title":2965,"updated_at":2966,"url":2967,"score":2884},"### Description\n\nI would like to have some demos in this repo, applying basic forces \n\n### Suggested solution\n\n_No response_\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/rapier/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/rapier/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://rapier.tresjs.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/tresjs/rapier/issues) that reports the same bug to avoid creating a duplicate.",[2962,2963],{"name":2904,"color":2905},{"name":2889,"color":2890},"rapier","Demos: apply forces","2024-09-12T13:49:59Z","https://github.com/Tresjs/rapier/issues/104",{"description":2969,"labels":2970,"number":2978,"owner":2866,"repository":2964,"state":2910,"title":2979,"updated_at":2980,"url":2981,"score":2982},"### Description\n\nThere are tons of props that we should be able to set in our RigidBody/collider\r\n\r\n- gravityScale\r\n- restitution\r\n- friction\r\n- mass (colliders)\n\n### Suggested solution\n\nAdding as a props and proper documentation\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/rapier/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/rapier/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://rapier.tresjs.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/tresjs/rapier/issues) that reports the same bug to avoid creating a duplicate.",[2971,2972,2975],{"name":2877,"color":2878},{"name":2973,"color":2974},"p3-significant","2C78E3",{"name":2976,"color":2977},"v1","5B6B67",119,"Props to the RigidBody/Colliders","2024-09-26T12:31:38Z","https://github.com/Tresjs/rapier/issues/119",0.7712987,["Reactive",2984],{},["Set"],["ShallowReactive",2987],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$f2_YlpxM0I7laSt9YYmBZ7v93Asl7ktUE5SsGCkAo9NY":-1},"/Tresjs/cientos/17"]