what happened to a clear division between js and css? In my experience many developers want nothing to do with css, they want a designer who can code to handle that
For very simple layouts, CSS is good enough, and it perhaps makes sense to split out the css into a separate file, so long as it's pretty clear what each class does, and the classes are pretty much all global so that changing a property of a class will do exactly what you intend (make the font size of all page titles on the site bigger), and not have unintended consequences on other components you weren't aware of, or thinking about.
For web apps built from many complex components, the flat, global nature of CSS becomes very clumsy indeed. The power and flexibility you need to manage styles of these components quickly outgrows the power of CSS.
You start having to rely on splitting the css into files that contain only styles applying to each component, so that the structure is manageable and you can find things and make changes easily. So why not just drop those styles right into the component file where they're referenced anyway? What concerns are you separating by keeping the css out in a separate file?
You also start having to rely on build-time tools like SASS and LESS to introduce the necessary features to handle complexity in a large, component-structured codebase: variables, scope, mixins, etc. All these things are trivial features of JS, so why not just use JS to put in the styles directly instead of doing it with css propped up by a complex tool-chain? What are you gaining by doing so, other than having the CSS in a separate file? And, again, why is this a good thing?
CSS is just a technology for applying styles to your markup. For many apps, it's in inferior technology to JS for doing this, particularly when using a framework like React.
It does make sense to bring css into the mix as well, as css can have functional effects. If you have a React component, for example, which explicitly toggles whether items are displayed or not, it makes sense to tie the toggling of the css display property directly into the component, rather than factoring it out into a separate stylesheet and creating an additional dependency.
Note that I'm not suggesting that all styling should be done this way - I think that would be disastrous - but that there is merit in composing the html, css and javascript together.
You can mess this up, of course. We are really good at making things more complex than they ought to be, especially while the ideas are fresh in our head. We just need to keep that in mind to :)
I'm not saying breaking CSS into separate files is a perfect solution (this is what I do), but at least it allows you to have everything in one place so anyone can pick up and customize.
I work with some pretty complicated enterprise CMS systems and they are already terrible complex. Last thing I want to do is start spreading CSS all over the app.
Inline styles were impossible to maintain. Even if these (reactCSS) are rendered inline, it's easy to maintain, easy to follow, easy to change.
Javascript used to refer to making things move around and handling click/hover events (javascript was the DOM language). Now it's the entire application.
what am I trying to say...? it seems wrong, but try it out and see if your concerns don't just go away.
I can see it getting verrry messy in wider circles - and I bet we'll go through a whole slew of bizarre process workarounds and frameworks until we end up with a solution that is suspiciously like "clear division between JS and CSS"!