classnamed-components

Make react components with functional CSS

Install

npm install classnamed-components

Usage

import * as React from 'react'
import { classnamed } from 'classnamed-components'
 
const MyButton = classnamed('button')`
  btn shadow
  ${props => ({
    big: 'btn-lg',
    small: 'btn-sm',
  }[props.size])}
`
const MySection = classNamed("section")`px-6 py-4 bg-white`;
 
const MyExample = (props) => (
  <MySection/>
    <MyButton size="big" />
    <MyButton size="small" className="ml-2" />
  <MySection/>
)

License

MIT © Hermanya