essence-chip

Essence Chip - Chip & ChipItem components.

How to use

Options:

• name: string for input name, default: chip
• text: string or html or component
• icon: string or image url
• deletable: boolean ( true or false ) - default: false
• onClose: callback for on closing chip component

import Chip from 'essence-chip/src/chip.jsx';

var redbullChip = {
  name: 'redbullChip',
  text: [<strong>Redbull</strong>, <span> (interest)</span>],
  icon: 'R',
  deletable: true,
  onClose: ( function () { console.log('redbullChip chip'); } )
}

var goproChip = {
  name: 'goproChip',
  text: [<strong>GoPRO</strong>, <span> (interest)</span>],
  icon: 'G',
  deletable: true,
  onClose: ( function () { console.log('goproChip chip'); } )
}

class ChipTest extends React.Component {
  constructor(props) {
        super(props);
        this.state = {
            classes: ClassNames(
                this.props.classes,
                this.props.className
            )
        };
    }

    render() {
        return (
          <Chip {...this.props} />
        );
    }
};

<Block>
  <ChipTest data={redbullChip} className={'e-left'} />
  <ChipTest data={goproChip} className={'e-left'} />
</Block>