tt-classnames

Utility for joining classNames together with name option for BEM styling.

Installation

npm install tt-classnames

Usage

import TTClassNames from 'tt-classnames';

const classNames = new TTClassNames();

const rootClassName = classNames('test', 123, ['what', 'futura'], {
  'bilder': true,
  'builder': false
});

// rootClassName equals 'test 123 what futura bilder builder'

Usage with React.js

import React from 'react';
import TTClassNames from 'tt-classnames';

const classNames = new TTClassNames({
  name: 'tt'
});

export default class Logo extends React.Component {
  render () {
    const currentPage = 'home';

    return (
      <div className={classNames('logo')}>         // className='tt__logo'
        <div className={className('line-1')} />    // className='tt__line-1'
        <div className={className('bg', {          // className='tt__bg tt__yellow'
          'yellow': currentPage === 'home',
          'blue': currentPage === 'about'
        })} />
      </div>
    );
  }
}

Contributions & Issues

Contributions are welcome. Please clearly explain the purpose of the PR and follow the current style.

Issues can be resolved quickest if they are descriptive and include both a reduced test case and a set of steps to reproduce.

Licence

Licensed under the MIT License © Trip-Trax 2015 - present.