non-primitive String is not handled similarly to primitive String

[adhami3310]

Current behavior:

Assigning the value of a style to non-primitive string new String does not behave identically to a primitive string "". It's currently mostly ignored.

To reproduce:

https://codesandbox.io/p/devbox/emotion-issue-template-forked-dkszyg

For example:

<h2 css={{ color: new String("salmon") }}>
   Start editing to see some magic happen!
</h2>

Notice how the color isn't actually applied.

Expected behavior:

To behave identically to:

<h2 css={{ color: "salmon" }}>
Start editing to see some magic happen!
</h2>

In which case the color actually applies.

Environment information:

• react version: 19.1.1
• @emotion/react version: 11.14.0

Note:

You might wonder why anyone would write this. I'm compiling a (python) object down into an emotion style. In other context, using new String is useful, and it would be annoying to change the behavior based if it's going to emotion or not. In any case non primitive strings should be handled identically to strings.

It's quite easy to coalesce things into primitive strings/values on emotion side. Before processing a value, one can do .valueOf(), which will make the primitive string from the non primitive string (and would work for other JS types as well, except for undefined and null).

[Andarist]

String objects are really rare in JavaScript (this is the first time it has been requested) and I'm not ready to add support for them on a hot path of this library. It's not even clear why you are using them - you mention that it's useful but you don't back this statement up with any arguments.