I love the idea. I'm working on something in the same general category, but a very different approach and I love seeing how others are tackling this problem. Over time I suspect we'll see more tools that attempt to bridge design tools with dev tools - every time I crack open Chrome's inspector, all I can think about is how amazing it could be if it was intended to be used by design teams.
Feel free to share your tool if it's open source. I'd love to see how you approach this problem. Happy to share more technical details if it helps your product.
Chrome inspector does so much more like clip support and media queries that I didn't even know about. It also writes directly to inline styles so propagating those changes as code is definitely possible. I was thinking if there's a way we can leverage the great work the Chrome devtool have already put in.
The inspector does write to inline styles, though if you try to listen for those changes with a mutation observer, it won't fire. I think they disable event propagation for inspector-driven DOM changes, which limits your ability to make use of it at the application layer. I've briefly considered just forking chromium, but I don't know C++ and not sure it makes sense to invest in that level of effort.
I don't want to step on your toes by linking my own project, but essentially my idea is: the editor creates an object representation of the html/css which can then be transpiled into any framework the user wants (so long as there is an existing transpiler for it). Then the output could be hosted on npm or some other remote repository for the application repo to install.
> I don't want to step on your toes by linking my own project
Not at all, it's in good spirit! Happy to talk through any technical details from my side :)
> though if you try to listen for those changes with a mutation observer, it won't fire
It doesn't have to fire an immediate mutation imo. When you click on an element to edit, you could inject a data-attribute into it (not sure if the Chrome Devtool let you do this but an extension might). At write-time, you can query the elements that were marked, get the delta and write it to code.
You might've thought of this longer than I have so I think that might be a naive solution.
> can then be transpiled into any framework the user wants
I feel like the way this conversation has gone is one of the biggest pluses of this being OSS. The discussion is less competitive. Discussions in public affect contributorship, it's important that they are positive and have minimal ego.
