react-classset
Version:
Utility for easily manipulating the DOM class string
36 lines (26 loc) • 1.03 kB
Markdown
# react-classset
`classSet()` is a neat utility for easily manipulating the DOM `class` string. This previously resided inside [React](https://github.com/facebook/react) as a utility, but is now pulled out and library-agnostic.
Here's a common scenario
```javascript
var classString = 'message';
if (isImportant) {
classString += ' message-important';
}
if (isRead) {
classString += ' message-read';
}
```
This can quickly get tedious, as assigning class name strings can be hard to read and error-prone. `classSet()` solves this problem:
```javascript
var classString = classSet({
'message': true,
'message-important': isImportant,
'message-read': isRead
});
```
When using `classSet()`, pass an object with keys of the CSS class names you might or might not need. Truthy values will result in the key being a part of the resulting string.
Alternatively, you can also use it this way:
```javascript
cx('a', 0, null, undefined, 'b'); // 'a 0 b', discards null values
```
No more hacky string concatenations!