Comment by jeswin
> React will be normalizing tight coupling, especially when combined with Tailwind.
You're skipping the history of why it came to be.
When I started writing HTML, you needed excellently structured CSS because there were no components. So you needed .sidebar, .topbar, .button.ok etc. This was extremely hard to get right. We cannot see the future, and we cannot know what an application will become - figuring out a globally scoped css hierarchy was difficult even for very experienced developers.
Post 2010 (with frameworks like Backbone.js and Angular), people started splitting apps into components. This meant that the smallest unit of reusable design could be a component, instead of CSS classes and JS functions. Adoption of self-contained styling in components increased gradually after Bootstrap brought in utility classes, CSS-in-JS picked up, and Tailwind made it easier.
It made total sense of course, because the component is what you want to re-use. To address your point directly, tight coupling within a component is ok - maybe even a good thing. We did not get there without trying other ideas, we tried them for twenty years.
BEM naming conventions in CSS and splitting HTML into components at the back end template level existed long before JS frameworks and single page applications.
I'd say the big mind-shifts with React were the virtual DOM replacing things like progressive enhancement, and later with Next and server side components, the commingling of back-end and front-end, which is mostly a complicated solution to the problem already created by moving away from progressive enhancement.