@chalarangelo/combine-class-names

1.0.0 • Public • Published

@chalarangelo/combine-class-names

JS Utility for cleaner className template literals in React

Usage

npm i @chalarangelo/combine-class-names
import combineClassNames from '@chalarangelo/combine-class-names';

const MyComponent = ({
  isCool,
  enabled = true,
  active = false,
  className
}) => (
  <div className={combineClassNames`
    my-component
    ${isCool ? 'cool' : 'not-cool'}
    ${enabled ? 'enabled' : '' }
    ${active ? 'active' : ''}
    ${className}
    `}
  />
);

ReactDOM.render(
  <MyComponent isCool enabled className='combined' />,
  document.getElementById('root')
);

// Result: <div class="my-component cool enabled combined"/>

Dependencies (0)

    Dev Dependencies (1)

    Package Sidebar

    Install

    npm i @chalarangelo/combine-class-names

    Weekly Downloads

    23

    Version

    1.0.0

    License

    MIT

    Unpacked Size

    8.54 kB

    Total Files

    5

    Last publish

    Collaborators

    • chalarangelo