css class conditional react dynamic
A tiny, no-dependency library for creating conditional css classes.
Features:
- Support string arguments.
- Support number arguments.
- Support object arguments.
- Support array arguments.
- Support function arguments.
- No dependency.
npm install dynamic-class-list
yarn add dynamic-class-list
Then require it in your module ...
var cl = require('dynamic-class-list').cl;
import { cl } from 'dynamic-class-list';
// As Arguments cl('class1', 'class2'); // Output ==> "class1 class2"
cl(['class1', 'class2']); // Output ==> "class1 class2" cl([null, undefined, 3, 'class1', 'class2']); // Output ==> "3 class1 class2"
Note that the key is used as the class if its value is truthy
cl({ class1: true, class2: false }); // Output ==> "class1" cl({ class1: undefined, class2: null, class3: true, class4: false }); // Output ==> "class3"
Note that the function must return a boolean.
cl({ class1: function () { return false; }, class2: function () { return true; }, }); // Output ==> "class2"
cl('class1', 'class2', 2, null, undefined, ['class3', null, undefined, 4, 'class4'], { class5: function () { return false; }, class6: function () { return true; }, class7: undefined, class8: true, class9: false, }); // Output ==> "class1 class2 2 class3 4 class4 class6 class8"
MIT © tusharf5