Classwind

Classwind is a JavaScript utility library designed to simplify the process of creating class names for HTML elements. It provides a quick and efficient way to assemble class names dynamically from various inputs like objects, arrays, and strings. Focusing on performance and ease of use, Classwind is well-suited for projects of all sizes and complexities, thanks to its small footprint and flexible nature.

Quick features

• ⚡ Blazing Speed: Unmatched performance.
• 🪶 Ultra-Lightweight: Just 331B!
• 🌐 Framework Agnostic: Fits any setup.
• 🛠️ Easy Integration: NPM, Yarn, CDN.
• 🔒 TypeScript: Built for reliability.
• ✅ Tested: Dependably robust.

Getting Started

Installation

Via NPM

Quickly add Classwind to your project with npm:

npm install classwind

Via Yarn

Alternatively, you can use Yarn to add Classwind to your project:

yarn add classwind

Via CDN

For immediate use in your web pages, incorporate Classwind through the jsDelivr CDN:

<script src="https://cdn.jsdelivr.net/npm/classwind/dist/classwind.min.js"></script>

Usage

Embrace the simplicity and power of Classwind with additional examples to demonstrate its versatility.

Example 1: Object Input

import cw from 'classwind';

const classes = cw({ 'bg-red-500': true, 'text-white': true, 'p-4': true });
// Result: 'bg-red-500 text-white p-4'

Example 2: Array Input

import cw from 'classwind';

const classes = cw(['text-lg', 'font-bold', { 'text-red-500': true }]);
// Result: 'text-lg font-bold text-red-500'

Example 3: String Input

import cw from 'classwind';

const classes = cw('bg-gray-200', 'p-4');
// Result: 'bg-gray-200 p-4'

Example 4: Combining Methods

import cw from 'classwind';

const classes = cw('border-2', { 'hidden': false, 'text-green-500': true }, ['rounded-lg']);
// Result: 'border-2 text-green-500 rounded-lg'

Example 5: Conditional Classes

import cw from 'classwind';

const isError = true;
const classes = cw('text-base', { 'text-error': isError, 'text-normal': !isError });
// Result when isError is true: 'text-base text-error'

Speed & Efficiency

Classwind stands alone in its speed and efficiency, setting a new standard as the fastest class name generation library available. It's designed for rapid execution and minimal footprint, ensuring optimal performance in every project.

API Reference

classwind(input): string

A robust function that generates a single string of class names from various input types, be it strings, objects, or arrays.

Parameters

• input: The input classes specified in any format.

Returns

A single string combining all valid class names.

Testing

Classwind maintains high standards of reliability and performance, underpinned by an extensive test suite using vitest. Execute these tests to verify its robustness and efficiency.

Get Involved

Your contributions are invaluable to the continuous improvement and innovation of Classwind. Whether you're enhancing features, fixing bugs, or enriching the documentation, your involvement drives the evolution of this library.

Community & Support

Engage with the Community

Become part of the Classwind community to find support, engage in discussions, and collaborate on projects. Share your experiences and learn from others.

Release Notes

Stay informed about the latest updates, features, and improvements in Classwind by checking the release notes regularly.

License

Classwind is open-sourced software licensed under the MIT License, reflecting our dedication to the development community. For the complete text, refer to the LICENSE file.