Why ReactJS way of mixing code with HTML is a better design?

Question

How is reactjs way of mixing code with html a better design?
All the time we think of separating HTML+CSS+Javascript to keep separation of concerns and to improve re-usability, maintainability.
Why go back and mix all these together?
It almost sounds as good as rolling back regulations on environment and there will always be some people who will justify it tooth & nail.

Answer 1

Not sure if it's a better design, but in the Introducing JSX section of the React docs, the same question is posed: Why JSX?

The reason the developers behind React prefer having JSX inside the component is that React assumes that the rendering logic is deeply related to event handling, state change, and so on, so instead of separating these two by putting JSX and logic in separate files, React separates concerns and keep the same concern inside one unit called component.

Instead of artificially separating technologies by putting markup and logic in separate files, React separates concerns with loosely coupled units called “components” that contain both. https://reactjs.org/docs/introducing-jsx.html

The docs suggest a talk by Pete Hun on Rethinking best Pratices, which might shine some light into the discussion: https://www.youtube.com/watch?v=x7cQ3mrcKaY