Closed kroudams closed 2 years ago
Hey, we don't plan to implement this feature. Please see comments on why below ⬇️
Allow
makeStyles
to usedisplayName
for user defined classes like in FUI V8 withmergeStyleSets
mergeStyleSets
generates monolithic classes while Griffel does Atomic CSS:
/* output from merge-classes */
.foo {
background-color: red;
display: flex;
}
/* output from Griffel */
.f3xbvq9 {
background-color: red;
}
.f22iagw {
display: flex;
}
Having separate code for development environment to generate completely different classes is not suitable for us. It will lead to bugs that will be hard to discovered 🥲
I'm aware that there is the Griffel devtools chrome extension for that purpose, but I'm not sure why to force to use this extension instead of making class names readable. Moreover, what about other browsers (e.g. Firefox)?
To clear, we are not forcing anyone to use it 🐱
It's just a tool that simplifies debugging and was inspired by styletron that has a similar issues with Atomic CSS. If you have any feedback on how we can improve devtools, please provide it in Griffel's discussions 🙏
P.S. Firefox support was not raised ever before, so please create an issue and we will prioritize it. AFAIK it should not be too hard to get the support as Firefox supports APIs that we used.
Library
React Components / v9 (@fluentui/react-components)
Describe the feature that you would like added
Allow
makeStyles
to usedisplayName
for user defined classes like in FUI V8 withmergeStyleSets
makeStyles
now generates a whole bunch of classes with ciphered names that is hard to understand. Would be nice to have old readable class names as in FUI V8 (e.g.my-class-15478
)P.S.
I'm aware that there is the
Griffel devtools chrome extension
for that purpose, but I'm not sure why to force to use this extension instead of making class names readable. Moreover, what about other browsers (e.g. Firefox)?Have you discussed this feature with our team
No response
Additional context
No response
Validations