classNames

classNames is a small JavaScript utility library designed to simplify the construction of CSS class name strings. It provides a single function, commonly imported as classNames, that joins multiple inputs into a space-separated string. The inputs can be strings, numbers, arrays, or objects, and the function selectively includes keys based on their values.

When invoked, the function flattens nested structures and filters out falsy values. Strings and numbers are included as-is. Arrays are recursively flattened. Objects are treated as maps of class names to boolean conditions; keys with truthy values are added to the result, while keys with falsy values are ignored. Null, undefined, and false are ignored.

Usage is common in UI frameworks such as React to apply classes conditionally. For example, classNames('button', { 'button--active': isActive, 'button--disabled': isDisabled }) will yield a string containing 'button' and any active or disabled modifiers depending on the boolean values.

Origin and ecosystem: The library was created by Jed Watson and published to the npm registry as classnames. It is widely adopted, MIT licensed, and maintained on GitHub. Several lightweight alternatives with similar behavior exist, such as clsx, which aims to be a smaller drop-in replacement.