What the idea behind deep merging if theme class name contains in parent class

[istarkov]

Thank you for this library, I have a small question about COMPOSE_DEEPLY logic.

Having function themeable

I got that merging style and theme objects has following logic.

const style = { a: 'xxx'};
const theme = { a: 'yyy'};
themeable(style, theme); // the result is {hello: "xxx yyy"}

const theme2 = { a: 'xxxzzz'};
themeable(style, theme2); // the result is {hello: "xxxzzz"}

so in first themeable call - classes are combined together but in the second call the theme class wins.

The only situation I see it's needed is to avoid class duplication if theme and style are the same css-module class names - and this will not work in all cases.

const style = { a: 'xxx aaa'};
const theme = { a: 'xxx zzz'};
themeable(style, theme); // the result is {hello: "xxx aaa xxx zzz"} xxx is duplicated

Is any other behaviors why it's needed? Please help to get the logic of this.

[javivelasco]

Thank you @istarkov !!

Now that you mention it... 🤔 Probably when I first coded the function I wanted to avoid including classes twice... but you are right. CSS Modules is already protecting you against this (assuming you hash your classes). I never thought about a class being a substring of another class 😬. This lib can be used without CSS Modules and this behavior can lead to issues in those scenarios so I guess the best is just to remove it. Test will pass anyway.

This will be included in the next release with the namespacing feature and another thing I want to propose. Also the docs are going to be updated with those changes.

Thank you so much for reporting!