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-listyarn add dynamic-class-listThen require it in your module ...
var getClassNames = require('dynamic-class-list').getClassNames; // deprecated var classList = require('dynamic-class-list').classList;import { getClassNames, classList } from 'dynamic-class-list';Note that getClassNames is deprecated and will be removed in next major release. You should use classList moving forward.
// As Arguments getClassNames('class1', 'class2'); // Output ==> "class1 class2" // OR classList('class1', 'class2'); // Output ==> "class1 class2"classList(['class1', 'class2']); // Output ==> "class1 class2" classList([null, undefined, 3, 'class1', 'class2']); // Output ==> "3 class1 class2"Note that the key is used as the class if its value is truthy
classList({class1: true, class2 : false}); // Output ==> "class1" classList({class1: undefined, class2 : null, class3: true, class4: false}); // Output ==> "class3"Note that the function must return a boolean.
classList({ class1: function() { return false; }, class2 : function() { return true; } }); // Output ==> "class2"classList('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"
