Undefined class name gets printed

[just-boris]

I have this code

import styles from './styles.css';

clsx({[styles.active]: isActive}); // returns "undefined" when `styles.active` is undefined

Live demo

Ideally this should work the same way as this code: clsx(isActive && styles.active)

[just-boris]

A possible fix would be to extend this line:

clsx/src/index.js

Line 18 in 74cefa6

if (mix[k]) {

-if (mix[k]) {
+if (mix[k] && mix[k] != 'undefined') {

But I am not sure if it is an acceptable size increase for the library

[lukeed]

This is intentional & matches classnames behavior.

As you've seen, when the key is evaluated, it's the string "undefined", which could very well be an intended classname as it's also valid.