classNames priority

[szubster]

I'm submitting a...

[ ] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report  
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[ ] Other... Please describe:

Current behavior

We are using material-ui v4 with reaflow and using the makeStyles API. Unfortunately changing nodeColor does not work when setting classname property, unless we add !important to rules.

Reaflow rules are always appended at the end of

and override our styles, which are injected a little bit before.

Expected behavior

It is possible to override default styling with classNames

Minimal reproduction of the problem with instructions

STEPS TO REPRODUCE:

Pass classname that changed

What is the motivation / use case for changing the behavior?

Possibility to use reaflow with material-ui

Do you think it would be viable to pass insertAt: top during build of reaflow through rollup plugin https://github.com/egoist/rollup-plugin-postcss/blob/a03c7bfc18b1d3275fd760d5c15030880891a9b9/README.md#inject so those styles would end up at the beginning of

making them overridable? Do you have other suggestion how to handle the problem, other than using style property.

Environment

Libs:
- react version: 16.14.0
- readlow version: 4.2.15


Browser:
- [x] Chrome (desktop) version 97
- [ ] Chrome (Android) version XX
- [ ] Chrome (iOS) version XX
- [ ] Firefox version XX
- [ ] Safari (desktop) version XX
- [ ] Safari (iOS) version XX
- [ ] IE version XX
- [ ] Edge version XX
 
For Tooling issues:
- Node version: XX  
- Platform:  

Others:

[szubster]

Although we inject ours styles at the end of head, they are injected before reflow styles get injected.