Research CSS modules to use on library level

[vitonsky]

• [ ] What's profits?
• [ ] Research problems
• [ ] How to express BEM approach and use modifiers as in cn library?
• [ ] How to override styles in high level components?
• [ ] What about selectors rely on inner selectors? Example: .Menu ~ .Button. Should we forward class name hooks?

[vitonsky]

Profits

Styles isolation

No conflicts with other components. But BEM quite good isolate CSS too

Ability to optimize CSS

We can remove unused CSS.

But actually no, due to dynamic use styles. I mean conditional use and use classes by dynamic names

Ability to analyze CSS

We can check custom CSS properties while compilation

---

No problem with Next.js

Now, global CSS on library level is not supported on next.js

But this is not problem of library, but problem of next.js design. The impossing a CSS modules/styled components on next.js side is not a reason to refactor library

---

Looks that CSS modules are useless for this UI kit