Proof of concept for a #r3f #threejs editor, watch this video with sound on 🔊! Current mood: It works but it'll be a big effort to make it usable. 🧵 for how it works 👇

The scene-to-source wiring is done by transforming the scenes AST wrapping scene objects in a group with contextual user data. Clicking on a scene object we traverse up the Three.js scene and if this data exists we can do something with it. Only the opened scene is transformed.

Surprise! The transformation isn't a bundler plugin but a Deno service that copies source, transforms it using ts-morph and saves it to a temp file. This temp file is then the file imported to the editor! Using ts-morph and the Deno service is important, let's talk about them.