Class name customize API

[oliviertassinari]

Summary

Today, the class names look something like this:

It's far from great DX, especially in dev-mode. It's actually a DX regression compared to emotion/sc.

Instead, I believe that we should get:

• [ ] 1. Start the class name prefix from -2 or something like -va1 not -1 for variants. There is already a first one, the main one, it's confusing.
• [ ] 2. In dev mode, use the names, like sc/emotion

How do we get the name? Either from the JavaScript variable name, or using some kind of a configurator. For example, sc uses withConfig({ displayName }), emotion uses styled(, { label }.

• [ ] 3. In prod mode, allow to reproduce https://v4.mui.com/ global class names with now class name hash like f1bxvs2e

Here, it's important to distinguish labels that developers can add without thinking about unicity and the ones that are guaranteed to be unique.

Examples

No response

Motivation

No response

Search keywords: -

[brijeshb42]

This is already in the works and will be part of v1. Default will always be random class though.