Current behavior:
I've noticed that using the ClassNames component does not properly utilize the cx function the way it behaves in the vanilla emotion package. The documentation states that "If you have used versions of Emotion prior to Emotion 10 or used vanilla Emotion, the css and cx functions work exactly like they do in those versions.". However, this does not appear to work this way. Calling cx(someEmotionClass, 'some-external-class') returns a malformed class list like class="name styles toString App".

To reproduce:

Here is a link to a simple codesandbox that uses css to create a style, then passes two classes: the emotion class and a string name. In vanilla emotion, this would output the classnames as expected

https://codesandbox.io/s/wonderful-wind-gr8nv

Expected behavior:

I was discussing with with @Andarist on slack and there's a little bit of confusion here as to how this behaves. In vanilla emotion, you can create a css class and call cx like cx(someEmotionClass, 'some-external-class') and the output would behave as expected. Since the documentation says it behaves the same here, I would expect to be able to call it here like this as well.

Environment information:

React version: 16.12.0
Emotion: @emotion/core 10.0.27

Where we left this is that this might be by design. If so, the documentation should provide a better example of how to call this here.