@5alid/cls

css className merge, with conditions

Usage no npm install needed!

<script type="module">
  import 5alidCls from 'https://cdn.skypack.dev/@5alid/cls';
</script>

README

Usage

npm i @5alid/cls
or
yarn add @5alid/cls

import cls from '@5alid/cls';

// signature cls(...args);
// args can be: string or [condition: boolean, string, string?]

// basic usage example
cls('px-4 py-1', 'bg-purple'); // result -> 'px-4 py-1 bg-purple'

// with conditions
cls('px-4 py-1', [true, 'bg-blue', 'bg-purple']); // result -> 'px-4 py-1 bg-blue'

Why?

this small utility helps cleaning up class names styling soluotions like tailwindcss, bootstrap etc.