1.0.2 • Published 8 months ago
pretty-class v1.0.2
Pretty Class
pretty-class is a lightweight utility package designed to simplify the process of generating dynamic class names in JavaScript and TypeScript applications. It provides a flexible and intuitive way to conditionally combine class names based on different input types.
Installation
To install pretty-class, use npm or yarn:
npm install pretty-classor
yarn add pretty-classUsage
Importing the Package
import prettyClass from 'pretty-class';Function Signature
export type prettyClassTypes = string | Record<string, boolean> | prettyClassTypes[] | undefined | null | false;
const prettyClass: (...args: prettyClassTypes[]) => string;Parameters
args: A variable number of arguments of typeprettyClassTypes. Each argument can be:- A
string: Adds the string directly to the class list. - An
objectwith keys as class names and values as boolean: Includes the key if the value istrue. - An
array: Recursively processes the array elements. undefined,null, orfalse: Ignored in the output.
- A
Returns
- A
stringcontaining the concatenated class names.
Example Usage
Basic String Input
const result = prettyClass('class1', 'class2');
console.log(result); // Output: "class1 class2"Conditional Classes
const result = prettyClass({ 'class1': true, 'class2': false, 'class3': true });
console.log(result); // Output: "class1 class3"Nested Arrays
const result = prettyClass(['class1', { 'class2': true }, ['class3', { 'class4': false }]]);
console.log(result); // Output: "class1 class2 class3"Mixed Inputs
const result = prettyClass('class1', { 'class2': true }, ['class3', null, false]);
console.log(result); // Output: "class1 class2 class3"Benefits
- Lightweight: Minimal code footprint.
- Flexible: Supports various input types.
- Recursive: Handles nested arrays gracefully.
- Typed: Fully typed for TypeScript users.
License
pretty-class is licensed under the MIT License. See the LICENSE file for more details.
For contributions, issues, or feature requests, visit the GitHub repository.