Using dynamic classnames with Tachyons

comp-that-merges-class-name.js

import React from 'react'
import classNames from 'classnames'

export default ({ isLoading, className, ...otherProps }) => {
  const cx = classNames(className, { 'bg-green': !isLoading }, { 'bg-yellow': isLoading })

  return <div className={cx} {...otherProps} />
}

comp.js

import React from 'react'
import classNames from 'classnames'

export default ({ isLoading, message, ...otherProps }) => {
  const cx = classNames('tc p2', { 'bg-green': !isLoading }, { 'bg-yellow': isLoading })

  return (
    <div className={cx} {...otherProps}>
      {message}
    </div>
  )
}