Re productivity, if it works for you, good for you but please don't attempt to reinterpret/bend the rules that are well established in the industry just to avoid criticism. For me, it's just an act of intellectual dishonesty.
React does violate the principle of separation of concerns and "we're working on a component not a document level" is not fooling anyone.
We should alert and educate people on this issue and then they can decide for themselves if they would go ahead nevertheless or stick to their guns. That's all!
Or are you making artificial boundaries between declarative and imperative code?
But throwing CSS declarations to the mix is just too much for me. Now I'll have to maintain markup/presentation/logic in the same place, that's a nightmare and ticking bomb IMHO.
Only if you're doing it wrong. Presentation logic and markup will be in the same place sure, that's a good thing, but any application logic not dealing directly with displaying dom elements shouldn't be in and among your presentation code. Your concerns are separated and your presentation code is in the same place, like you would logically think they should be.
I have watched React Native talks in which they were advocating for this and bluntly calling it proper "separation of concerns".
But when you say that presentational markup and logic should be grouped together, doesn't this mean that we have to divide our js files even further to separate business logic from presentation or view logic?
But doesn't your last comment rail against all these "fanbois" not blindly following "best practices" and actually attempting to find out what works best?
In fact, your next sentence in this comment:
>please don't attempt to reinterpret/bend the rules that are well established in the industry
You seem to be contradicting yourself.
https://speakerdeck.com/vjeux/react-css-in-js
I have apps in production with it you can look at the code to as well:
https://github.com/reapp/hacker-news-app